如何传递查询字符串Backbone.js的路由 [英] How can I pass query string to backbone.js routing

问题描述

我使用Backbone.js的和jQuery移动。 jQuery的移动路由被禁用，我使用的lib只针对UI。我得到的一切工作，除了选择网页过渡。我需要通过网页过渡（切片式，淡出，滑盖向下）的骨干路由器，因为转型是基于在用户来自不同而不同。

I'm using Backbone.js and jQuery-mobile. jQuery-mobile routing is disabled and I'm using the lib only for UI. I got everything working, except selecting page transition. I need to pass the page transition ('slice-up', 'fade', 'slide-down') to the Backbone router because the transition is varying based on where the user comes from.

我想通了非常丑陋的方式做到这一点，通过URL将它们传递：

I have figured a very ugly way to do it, to pass them via the url:

class App.Routers.Foods extends Backbone.Router
  routes:
    '': 'index'
    ':transition': 'index'
    'foods/new': 'new'
    'foods/new/:transition': 'new'

  initialize: ->
    @collection = new App.Collections.Foods()
    @collection.fetch()

  index: (transition)->
    view = new App.Views.FoodIndex(collection: @collection)
    App.changePage(view, transition)

  new: (transition)->
    view = new App.Views.FoodNew(collection: @collection)
    App.changePage(view, transition)

下面是HTML链接的默认过渡：

Here is the html link for default transition:

<a href="#" data-icon="back" class="ui-btn-left">Back</a>

下面是HTML链接淡出过渡：

Here is the html link for fade transition:

<a href="#fade" data-icon="back" class="ui-btn-left">Back</a>

使用查询字符串，即/食品/新？的过渡='褪色'是肯定更好，但我不知道如何定义骨干路由使用的查询字符串变量。

Using the query string, i.e. /food/new?transition='fade' is definitely better but I don't know how to define the backbone routing to use query string variables.

我应该怎么做呢？

有没有来处理我的问题，即不通过使用url变量都更优雅的方式？

Is there a more elegant way to handle my problem, i.e. passing the variable not using the url at all?

推荐答案

您必须手动解析路由器功能内的URL参数。

You will have to manually parse the URL parameter inside the router functions.

class App.Routers.Foods extends Backbone.Router
  routes:
    '': 'index'
    'foods/new': 'new'

  initialize: ->
    @collection = new App.Collections.Foods()
    @collection.fetch()

  index: ()->
    view = new App.Views.FoodIndex(collection: @collection)
    App.changePage(view, getQueryVariable('transition'))

  new: ()->
    view = new App.Views.FoodNew(collection: @collection)
    App.changePage(view, getQueryVariable('transition'))

JS功能解析查询参数。

function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split("=");
        if (pair[0] == variable) {
            return unescape(pair[1]);
        }
    }
    return false;
}

您当然会转换的JS功能，CS，但你的想法。

You will of course have to convert the JS function to CS but you get the idea.

这篇关于如何传递查询字符串Backbone.js的路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！