javascript - 如何调试 Meteor 中 URL Router.go 闪烁的问题？

Question

我希望我能给出更详细的答复，但我什至不知道如何调试这种情况。

情况:当我点击按钮时，URL 瞬间变为 http://localhost:3000/register 。没有呈现任何新内容，页面保持不变，就像我没有单击任何内容一样。我尝试过的事情:

• 输入 Router.go('/register')在控制台中工作正常
• 我已经在每一条路线上尝试过这个，而不仅仅是 /register路线
• 我已在 Firefox 和 Chrome 中尝试过此操作
• 如果我使用{{pathFor 'templateName'}}，这不是问题在模板中，仅当我使用 Router.go('path') 时

我的标题中有一个用于注册的链接:

Template.header.events({
  'click .register-btn': function(e) {
        Router.go('/register');
    }
});

当然，我的模板中有这个: <a href="#" class="register-btn">Contact</a>

这是我的整个路由文件，router.js :

Router.configure({
  layoutTemplate: 'layout',
  loadingTemplate: 'loading',
  notFoundTemplate: 'notFound'
});

// Routes
Router.route('/', {
    name: 'landingPage',    // Main domain routing
    layoutTemplate: 'landingLayout',
    onBeforeAction: function (pause) {
            if (Meteor.user()) {
                Router.go('/home');
            } else {
                this.next();
            }
        }
});
Router.route('/home', {
    name: 'siteHome',
    onBeforeAction: function() {
        if (this.ready()){
            if (!Meteor.loggingIn())
                AccountsTemplates.ensureSignedIn.call(this);
        }else{
            // render the loading template but keep the url in the browser the same
            this.render('loading');
            this.renderRegions();
        }
    }
});

Router.route('/weekly_goal/set', {
    name: 'setWeeklyGoal'
});
Router.route('/make_entry', {
    name: 'makeEntry'
});

// Login and Register Routes
AccountsTemplates.configureRoute('signIn', {
    name: 'login',
    path: '/login',
    template: 'siteLogin',
});
AccountsTemplates.configureRoute('signUp', {
    name: 'register',
    path: '/register',
    template: 'siteRegister',
    redirect: '/',
});

Answer 1

当您单击表单内的按钮时，默认浏览器行为是提交表单，这会导致另一个 HTTP 请求并重新加载页面。为了避免这种情况，您的事件处理程序需要显式阻止默认行为:

Template.header.events({
  'click .register-btn': function(e) {
    e.preventDefault();
    Router.go('/register');
  }
});