javascript 使用 Backbone.js 悄悄地将 url 更改为以前的

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8416074/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 03:22:57  来源:igfitidea点击:

Silently change url to previous using Backbone.js

javascripturlbackbone.jspushstate

提问by user802232

Using Backbone.js, is it possible to make the router navigate to the page where it came from? I'd like to use that for the case where I change my URL when a popup appears, and I want go change it back, when I hide the popup. I don't want to simply go back, because I want to keep the background page in precisely the same position as I left it before I showed the popup

使用 Backbone.js,是否可以让路由器导航到它来自的页面?我想在出现弹出窗口时更改我的 URL 的情况下使用它,当我隐藏弹出窗口时,我想将其更改回来。我不想简单地返回,因为我希望在显示弹出窗口之前将背景页面保持在与离开它完全相同的位置

回答by mateusmaso

You can solve this problem by extending Backbone.Routerand storing all the routes during navigation.

您可以通过Backbone.Router在导航期间扩展和存储所有路线来解决此问题。

class MyRouter extends Backbone.Router
  constructor: (options) ->
    @on "all", @storeRoute
    @history = []
    super options

  storeRoute: ->
    @history.push Backbone.history.fragment

  previous: ->
    if @history.length > 1
      @navigate @history[@history.length-2], true 

Then, when you have to dismiss your modal, simply call the MyRouter.previous()method that it will redirect you back to the last "hash".

然后,当您必须关闭模态时,只需调用MyRouter.previous()它会将您重定向回最后一个“哈希”的方法。

回答by DrewB

I think mateusmaso's answer is mostly right but requires some tweaks to guarentee that you always get the right URL you are looking for.

我认为 mateusmaso 的答案大部分是正确的,但需要进行一些调整以确保您始终获得所需的正确 URL。

First you need to override the route method to have a beforeRoute method fire:

首先,您需要覆盖路由方法以触发 beforeRoute 方法:

route: (route, name, callback) =>
   Backbone.Router.prototype.route.call(this, route, name, =>
     @trigger('beforeRoute')
     callback.apply(this, arguments)
   )

Then you bind the event and initialize the history instance variable:

然后绑定事件并初始化历史实例变量:

initialize: (options) ->       
   @history = []
   @on "beforeRoute", @storeRoute

Next create helper methods for storing and retrieving the fragment:

接下来创建用于存储和检索片段的辅助方法:

storeRoute: =>
   @history.push Backbone.history.fragment

previousFragment: =>
   @history[@history.length-2]

Finally, you need one final helper method that can be used to change the URL without reloading and store the resulting fragment. You need to use this when closing the pop up or you won't have the expected fragment in your history if the user gets the pop up again without navigating anywhere else. This is because calling navigate without "trigger: true" won't trigger the event handler to store the fragment.

最后,您需要一个最终的辅助方法,该方法可用于在不重新加载和存储结果片段的情况下更改 URL。您需要在关闭弹出窗口时使用它,否则如果用户在没有导航到其他任何地方的情况下再次弹出窗口,您的历史记录中将不会有预期的片段。这是因为在没有“trigger: true”的情况下调用导航不会触发事件处理程序来存储片段。

changeAndStoreFragment: (fragment) =>
   @navigate(fragment)
   @storeRoute()

回答by man

This answer may not address the question, but it's preety much the same issue. I couldn't navigate silently to a previous route, or a custom route because of the trailing slash. In order for route functions to NOT be triggered, use {trigger:false}, or don't use trigger at all since falseis the default behaviour, and make sure your route begins with #somethinginstead of '#/something' (notice the slash), or change the regEx inside Backbone.js, the router part.

这个答案可能没有解决这个问题,但它几乎是同一个问题。由于尾部斜杠,我无法静默导航到以前的路线或自定义路线。为了不触发路由功能,请使用{trigger:false}或根本不使用触发器,因为这false是默认行为,并确保您的路由以#something而不是 '#/something'开头(注意斜线),或更改正则表达式在 Backbone.js 中,路由器部分。

回答by ProTom

You can trigger a route in the onCloseEvent of your popup or overlay with:

您可以在弹出窗口或叠加层的 onCloseEvent 中触发路由:

router.navigate('/lasturl/');

This will set the url. If you pass true as the second param, you also will execute the routes action. Otherwise the page will be left unchanged.

这将设置网址。如果您将 true 作为第二个参数传递,您还将执行路由操作。否则页面将保持不变。

http://documentcloud.github.com/backbone/#Router-navigate

http://documentcloud.github.com/backbone/#Router-navigate