reactJs微信端接入网易七鱼客服

项目中有联系客服的功能，我们需要在微信端接入网易七鱼客服系统，记录一下使用方法。

网易七鱼客服在线连接分为 服务异步加载（推荐）和 服务同步加载

1、服务异步加载（推荐）

我是在react的外层html中引入 

<script>
(function (w, d, n, a, j) {
w[n] = w[n] || function () {
(w[n].a = w[n].a || []).push(arguments);
};
j = d.createElement('script');
j.async = true;
j.src ='https://qiyukf.com/script/044865c94981c048609d5c94c1ae9c6d.js';
d.body.appendChild(j);
})(window, document, 'ysf');
</script>

在全剧设置时会导致每个子页面都会加载七鱼，可以在需要使用的页面按需加载

此时 ysf 为全剧变量，在组件中可以调用

let isSdkReady = false;

componentDidMount() {

　　window.ysf('onready', function () {
  　　isSdkReady = true;
　　});

}

qiyuHandle = () => {
  if(isSdkReady) {
    window.location.href = window.ysf('url');
  }else {
    Toast.info("sdk尚未加载成功，请稍后再试", 1);
    return false;
  }
}
render() {
　　return (

　　　　<span onClick={() => { this.qiyuHandle(); }}>
  　　　　<span>客服</span>
　　　　</span>

　　);
}
2.服务同步加载

<script src="https://qiyukf.com/script/044865c94981c048609d5c94c1ae9c6d.js"></script>

网易七鱼Web开发指南(V2)：https://qiyukf.com/docs/guide/web/Web_SDK_Guide.html