问题描述
我正在尝试将Tawk.To小部件添加到我的React APP。
我已将小部件(Java脚本)添加到我的应用程序中,当我打开页面时,它会完美加载,但是当我移到另一个页面时,脚本仍然存在。
当我移到另一页时,谁能指导我如何卸载此脚本?
以下是我使用的代码。
import React,{Component} from "react";
import ReactDOM from "react-dom";
import Footer from "../Footer";
class App extends Component {
componentDidMount() {
const script = document.createElement("script");
script.id = 'tawkId';
script.async = true;
script.src = 'https://embed.tawk.to/' + '5f01080d223d045fcb7b5265' + '/default';
script.charset = 'UTF-8';
script.setAttribute('crossorigin','*');
document.body.appendChild(script);
}
render() {
return (
<React.Fragment>
<Footer active_chat={true} />
</React.Fragment>
);
}
}
export default App;
解决方法
删除onComponentUnmount()上ID为“ tawkId”的脚本
componentWillUnmount() {
document.getElementById("tawkId").remove();
}