Question

我正在使用Driftbot，See Here 并且我试图根据当前路线/网址启用/禁用它。我正在使用REACT-ROUTER。

我可以使用drift.unload()阻止它运行（在我的componentWillMount()函数中），但我无法再次启动它。

我们有一些代码已经从这里开始工作，除了我们现在需要修改它以便在特定页面上禁用它。

以下是我们目前使用的代码：

let driftbot_function = function() {
      !function() {
        var t;
        if (t = window.driftt = window.drift = window.driftt || [], !t.init) return t.invoked ? void (window.console && console.error && console.error("Drift snippet included twice.")) : (t.invoked = !0,
        t.methods = [ "identify", "config", "track", "reset", "debug", "show", "ping", "page", "hide", "off", "on"],
        t.factory = function(e) {
          return function() {
            var n;
            return n = Array.prototype.slice.call(arguments), n.unshift(e), t.push(n), t;
          };
        }, t.methods.forEach(function(e) {
          t[e] = t.factory(e);
        }), t.load = function(t) {
          var e, n, o, i;
          e = 3e5, i = Math.ceil(new Date() / e) * e, o = document.createElement("script"),
          o.type = "text/javascript", o.async = !0, o.crossorigin = "anonymous", o.src = "https://js.driftt.com/include/" + i + "/" + t + ".js",
          n = document.getElementsByTagName("script")[0], n.parentNode.insertBefore(o, n);
        });
      }();

      drift.SNIPPET_VERSION = '0.3.1';
      drift.load('****__our-key__****');
      drift.page();
    }

    driftbot_function();

这是我们componentDidMount()的{{1}}，因为它是我们的根app.js。我也尝试在'/'的脚本标记内移动它，但结果相同。

当链接到我想要禁用的部分应用时，唯一会禁用它的方法是index.html。 window.drift.unload()和.hide无效。

当回到root时，我有命令.off，但现在它是一个空函数，在运行window.drift.load()函数之前，它正在运行。

我还尝试在我的unload()和root.js文件中包含上面链接的Drift Docs中的功能无效

有没有人有任何想法？

Answer 1

我可以为您的案例考虑两种选择。首先是创建一个仅用于启动/停止漂移机器人的组件。您可以在componentDidMount上初始化driftbot，然后在window.drift.unload()上调用componentWillUnmount。然后，不是用它包装整个应用程序，而是只将它放在主页中，这样当你导航到另一个部分时它将被卸载。

另一个选项，既然您提到了React路由器，就会使用location - https://github.com/ReactTraining/history来查看应用的history.listen，或者检查React路由器提供的道具 - https://reacttraining.com/react-router/web/api/location - 在componentWillUpdate上，然后根据当前网址打开和关闭漂移机器人。

Answer 2

所以这是一个非常令人困惑的旅程，但我终于在漂移的一些工程师的帮助下弄明白了。

首先，在“黑名单”网址的破折号设置中，您只需要包含不是完整网址的关键字（我的第一个错误）。

其次，将fucntion放在index.html文件

中的脚本中

第三，找到您希望禁用窗口小部件的所有顶级路由组件，并在其反应文章中包含以下代码

componentWillMount() {
  drift.page(this.props.location.pathname)
}
componentWillReceiveProps(nextProps) {
  if (nextProps.location.pathname !== this.props.location.pathname) {
    drift.page(nextProps.location.pathname)
  }
}

这将基本上重新初始化窗口小部件，并根据您提供的网址（.includes）针对设置黑名单中的关键字运行this.props.location.pathname检查。然后它将禁用它或根据结果启用它。

你去了，祝其他人坚持这个好运......

Answer 3

drift.page（）对我不起作用

我正在使用npm包进行反应
https://github.com/chardmd/react-drift
漂移是我的顶级组件之一

   <Drift appId='6t5krhy2ri26' />
    <Favicon url={this.favicon} />
    <Meta
      meta={this.state.data.metaTags}
    />

设置路由规则，然后在漂移UI中将其设置为正常

   componentDidUpdate (prevProps, prevState, snapshot) {

const prevLoc = prevProps.location.pathname
const newLoc = this.props.location.pathname

if (prevLoc !== newLoc) {
 window.drift.reset()

在单个页面中使用Driftbot React App

3 个答案: