外部Java脚本React ReduxTawk.to卸载

问题描述

我正在尝试将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();
}