0

我使用 yii2 作为后端框架，我想为我的应用程序制作游览，但是第二页上没有显示引导游览弹出框，我为引导游览创建了一个资产包并将其注册到布局中，引导游览在第一页上正常工作页面，但是当转到另一个页面时，它会出现问题并在下一页显示调试：
Bootstrap Tour 'tour' | 重定向到纸张/上传
Bootstrap Tour 'tour' | 错误重定向循环到纸张/上传

我已经在 chrome 的开发人员工具中检查了窗口本地存储，并在显示第二页窗口本地存储时看到它在正确的步骤上：tour_current_step value 2，

还有一个问题，我应该如何在 yii2 路由器的引导程序中设置路径选项的值，我的路径是否正确？例如第一步在网站的主页上是：“”，是否正确，我想如果有人点击popover的上一个按钮返回上一步。
这是我的 javascript 代码，我在布局文件中注册了这个 javascript 代码： 

 $(function() {
    var $demo, duration, remaining, tour;
    $demo = $("#demo");
    duration = 5000;
    remaining = duration;
    tour = new Tour({
      onStart: function() {
        return $demo.addClass("disabled", true);
      },
      onEnd: function() {
        return $demo.removeClass("disabled", true);
      },
      debug: true,
      steps: [
        {
          path: "",
          element: "#demo",
          placement: "bottom",
          title: "Welcome to Bootstrap Tour!",
          content: "Introduce new users to your product by walking them through it step by step."
        }, {
          path: "",
          element: "#Wordcounter",
          placement: "bottom",
          title: "Step One",
          content: "For translation click on word counter menu item"
        }, {
          path: "paper/upload",
          element: "#myDropzone",
          placement: "top",
          title: "Step two",
          content: "Drag and Drop your file here or click to upload plz wate to complete upload"
        }
        ,
        {
          path: "paper/upload",
          element: "#next",
          placement: "bottom",
          title: "Step three",
          content: "then Click on the Next Bottom",
          reflex: true
        }, {
          path: "paper/show",
          element: "#save",
          placement: "top",
          title: "Step four",
          content: "click on save and continue and choose language plan",
          duration: 5000
        }
      ]
    }).init();
    if (tour.ended()) {
      $('<div class="alert alert-info alert-dismissable"><button class="close" data-dismiss="alert" aria-hidden="true">&times;</button>You ended the demo tour. <a href="#" data-demo>Restart the demo tour.</a></div>').prependTo(".content").alert();
    }
    $(document).on("click", "[data-demo]", function(e) {
      e.preventDefault();
      if ($(this).hasClass("disabled")) {
        return;
      }
      tour.restart();
      return $(".alert").alert("close");
    });
  });

4

1 回答 1

0

我在代码上做了很多工作，终于找到了答案，问题出在路径上，我在 URL 管理器中使用了漂亮的 URL，并且引导程序需要关系路径，如果当前页面中的路径与路径不同在 bootstrap tour 的步骤中，它会进入重定向循环，这是因为 bootstrap tour 找不到，是否需要重定向，这是 bootstrap tour 的短代码 where go to redirect loop

      if (step.redirect && this._isRedirect(step.host, path, document.location)) {
        this._redirect(step, i, path);
        if (!this._isJustPathHashDifferent(step.host, path, document.location)) {
          return;
        }
      }

当路径应该从路由器获取时（例如在 Yii、Laravel、Symfony 等框架中）解决这个问题，引导程序建议在步骤中使用 onNext 属性并重定向到一个地址。
但就我而言，我更改了 bootstrap tour 的源代码，以更好的形式找到我的答案，并将上面的代码替换为以下代码：

    var current_url = document.URL;
    var result = current_url.includes(path);        
    if(!result){
        this._redirect(step, i, path);
        if (!this._isJustPathHashDifferent(step.host, path, document.location)) {
          return;
        }            
    }

并将重定向代码更改为：

    Tour.prototype._redirect = function(step, i, path) {
      var href;
      if ($.isFunction(step.redirect)) {
        return step.redirect.call(this, path);
      } else {
          href = this._options.domainAddress + path;
//        href = {}.toString.call(step.host) === '[object String]' ? "" + step.host + path : path;
        this._debug("Redirect to: " + href);
        if (this._getState('redirect_to') === ("" + i)) {
          this._debug("Error redirection loop to " + path);
          this._removeState('redirect_to');
          if (step.onRedirectError != null) {
            return step.onRedirectError(this);
          }
        } else {
          this._setState('redirect_to', "" + i);
          return document.location.href = href;
        }
      }
    };

并在选项域地址中定义一个全局变量，但我认为这不是更改引导程序源代码的好方法，但它适用于我的情况。

于 2017-02-07T11:32:03.887 回答