主路由器在路由“”的末尾附加一个#"导致dom中引用锚点在Backbone/Require应用程序中不起作用

Main Router appends a # at the end of route "" cause in dom referencing anchors not work in Backbone/Require app

本文关键字：dom 导致 quot 引用 应用程序 不起作用 Require Backbone 一个 路由器 路由      更新时间：2023-09-26

在Backbone.Router主路由器中，我在应用程序加载时有""路由作为开始路由。它的方法决定是先创建并呈现登录视图还是主视图。当在没有路由的情况下访问localhost:8080/indexapp时，它触发下面的第一个路由，即空的""路由。登录并到达homeview后，地址栏中的url看起来像localhost:8080/indexapp#。从这一点来看，引用文档中当前可用的一些dom元素的普通锚点href不会导致它们。如果我删除url末尾的hash并刷新页面，那么锚点就可以正常工作。

这是什么原因？解决这个问题的方法是什么？

主路由器：

define([
    'jquery',
    'ratchet',
    'underscore',
    'backbone',
    'forms/formsdatamodel',
    'login/loginview',
    'register/registerview',
    'home/homeview',
    ],
    function($, Ratchet, _, Backbone, formsDataModelInst, LoginView, RegisterView, HomeView){
        var MainRouter = Backbone.Router.extend({
            routes: {
                "": "render_home",              
                "login": "render_login",
                "register": "render_register",
            },
            initialize: function(){
                this.listenTo( formsDataModelInst, 'sync', this.render_home );
            },
            render_home: function(){
                if( formsDataModelInst.get('loginp') == true ){ //show you app view for logged in users!
                    this.homeView = new HomeView();
                    this.homeView.render();
                }
                else if ( formsDataModelInst.get('loginp') == false ){ //not logged in!
                    Backbone.history.navigate("/login", {trigger:true});
                }
            },
            render_login: function(){ //display your login view
                this.loginView = new LoginView;
                this.loginView.render();
            },
            render_register: function(){ //display your register view
                this.registerView = new RegisterView;               
                this.registerView.render();
            },
        });
        return MainRouter;
});

我的想法是避免地址栏中#之后的空url，以克服无法工作的锚点。我不知道在没有#的情况下，在打空路由时如何制作地址栏url。我已经修改了主路由器，以避免#之后的空url通过：

将""路由与方法gate相关联，该方法导航到与决定渲染哪个的方法render_home_or_login相关联的路由"/home"。

修改后的路线：

routes: {
                "": "gate",
                "home": "render_home_or_login",
                "login": "render_login",
                "register": "render_register",
}

增加了门方法：

gate: function() {
                Backbone.history.navigate("/home", {trigger:true});
            },

通过这种方式，路线将在其裸露的情况下显示为类似localhost:8080/indexapp#home。在地址栏中避免emty url已经解决了这个问题。

相关文章：