为多个可选值简化骨干路由器答案

【问题标题】：Simplify Backbone Router for multiple optional values为多个可选值简化骨干路由器
【发布时间】：2015-12-19 02:23:18
【问题描述】：

App.Routers.Applications = Backbone.Router.extend({

    initialize: function () {
        this.view = Object.create(App.Views.Applications);
        this.view.init();
    },

    routes: {
        'search/:query/status/:status/page(/:page)': 'search_status_page',

        'search/:query/status(/:status)': 'search_status',
        'search/:query/page(/:page)': 'search_page',
        'status/:query/page(/:page)': 'status_page',

        'search(/:query)': 'search',
        'status(/:status)': 'status',
        'page(/:page)': 'page',

        '': 'index',
    },

    index: function () {
        this.view.renderPage();
    },

    search: function (query) {
        this.view.renderPage({search:query});
    },

    status: function (status) {
        this.view.renderPage({status:status});
    },

    page: function (page) {
        this.view.renderPage({page:this.toNumber(page)});
    },

    search_status: function (query, status) {
        this.view.renderPage({search:query, status:status});
    },

    search_page: function (query, page) {
        this.view.renderPage({search:query, page:this.toNumber(page)});
    },

    status_page: function (status, page) {
        this.view.renderPage({status:status, page:this.toNumber(page)});
    },

    search_status_page: function (query, status, page) {
        this.view.renderPage({search:query, status:status, page:this.toNumber(page)});
    },

    toNumber: function (page) {
        return parseInt(page, 10) || 1;
    }
});

有什么方法可以简化这个路由器吗？它将接收不同的参数，搜索，状态和页面，所有这些都是可选的。

首先，我正在研究将所有路线合并为一条的可能性。这可以通过对 Backbone 路由器工作原理的深入了解来实现。

第二个可能性是将所有方法（减去toNumber）合并为一个。使用?search=aaaa&status=bbbbb 类型的路由可能会更容易。

-- 顺便说一下，如果您想知道初始化方法，我不会使用 Backbone View。

【问题讨论】：

标签： backbone.js backbone-routing

【解决方案1】：

所以这是我能想到的最好的解决方案，它可以灵活地接受许多参数。但是 url 哈希的格式必须类似于 #search=aaa&status=bbb&page=2，而不是更好的默认格式 #search/aaa/status/bbb/page/2。但我相信这种权衡是值得的。

App.Routers.Applications = Backbone.Router.extend({

    initialize: function () {
        this.view = Object.create(App.Views.Applications);
        this.view.init();
    },

    routes: {
        '(:param)': 'render'
    },

    render: function (param) {
        var options = this.getOptionsFromHash(param);
        this.view.renderPage(options);
    },

    getOptionsFromHash: function (hash) {
        if (!hash) return {};

        var options = {}, values;

        hash.split('&').forEach(function (pair) {
            values = pair.split('=');
            options[values[0]] = values[1];
        });

        return options;
    }
});

【讨论】：