钉钉微应用中显示泛微ecode开发的页面标题问题

这个问题不是大问题，但是当时没有想明白，结果消耗了我大半天的时间，在此记录下，也给未来同样问题的小朋友们提供一个解决思路。

1、问题来源

        公司业务问题需要使用钉钉微应用来打开OA的页面（使用ecode开发的），所有页面在浏览器中打开都可以正常显示title标题，但是使用微应用打开就不显示。

2、问题原因及解决办法

        原因：ecode使用的语法是react，标准设置title的方法是document.title='标题'，但是放在钉钉微应用中无效。需要使用钉钉自有的方法。

        解决方法：使用如下方法

第一步：加载dingtalk.open.js

componentDidMount() {
    //document.title="999"; 这是标准react中修改title的方法，但是丁丁微应用中不可以
    const script = document.createElement('script');
    script.src = "https://g.alicdn.com/dingding/dingtalk-jsapi/2.10.3/dingtalk.open.js";
    script.async = true;
    script.onload = () => this.setTitle("所有流程");
    document.body.appendChild(script);
  }

第二步：使用钉钉的方法设置title 

dd.biz.navigation.setTitle({
	title: "邮箱正文",
	onSuccess : function(res) {
		// 调用成功时回调
		console.log(res)
	},
	onFail : function(err) {
		// 调用失败时回调
		console.log(err)
	}
});

完整代码：

class simpleRoot extends React.Component {
  componentDidMount() {
    //document.title="999"; 这是标准react中修改title的方法，但是微应用中不可以
    const script = document.createElement('script');
    script.src = "https://g.alicdn.com/dingding/dingtalk-jsapi/2.10.3/dingtalk.open.js";
    script.async = true;
    script.onload = () => this.setTitle("自定义标题");
    document.body.appendChild(script);
  }

  setTitle(title) {
    dd.biz.navigation.setTitle({
      title: title,
      onSuccess : function(res) {
        // 调用成功时回调
        console.log(res)
      },
      onFail : function(err) {
        // 调用失败时回调
        console.log(err)
      }
    });
  }

  render() {
    return (
      //自定义内容
    )
  }
}