将 React 与 Meteor 一起使用：注销后如何处理 Meteor.user()

Question

我的 Meteor 应用中有一个使用 React 组件构建的用户个人资料页面。因为它使用 Meteor.user() 创建变量之一，所以每当我退出应用程序时都会收到错误消息（但前提是我之前曾在当前会话中访问过个人资料页面）。这对我来说确实有意义，因为没有当前用户，Meteor.user() 不再可用，所以它会出错并显示“无法读取未定义的'支持'”消息。

AccountList = React.createClass({
    mixins: [ReactMeteorData],
    getMeteorData(){
        var user;
        var supportingUserId = Meteor.user().support.supportingUserId;
        supportingUserId ? user = Meteor.users.findOne({_id:  supportingUserId}) : user = Meteor.user();
        return {
            accounts: Accounts.find({owner: user._id}).fetch()
        }
    }...

最初，我尝试更改上面的代码块以将有问题的代码包装在 if 语句中，如下所示：

AccountList = React.createClass({
    mixins: [ReactMeteorData],
    getMeteorData(){
        var user;
        if (Meteor.user()){
            var supportingUserId = Meteor.user().support.supportingUserId;
            supportingUserId ? user = Meteor.users.findOne({_id:  supportingUserId}) : user = Meteor.user();
            return {
                accounts: Accounts.find({owner: user._id}).fetch()
            }
        }
        else{
            return {};
        }
    }...

但是我遇到了另一个错误：“无法读取未定义的属性'长度'”，这是由未定义的帐户引起的（由另一个需要“帐户”的渲染方法触发）。我最终采用了相同的方法并添加了一个额外的 if 语句，但遇到了另一个类似的错误。我的问题是是否有可能解决这个问题而不必将一半的应用程序包装在“if (Meteor.user())”语句中。或者是否有办法让应用程序在注销时记住加载的 React 组件？

Answer 1

米歇尔弗洛伊德的方法是正确的！

您可以在路由器中执行以下操作：

FlowRouter.route('/profile/edit', {
  name: 'profile.edit',
  triggersEnter: [function(context, redirect) {
    if(!Meteor.user()){
      console.log('User not logged in. Redirecting...');
      redirect('login');
    }
  }],
  action(params) {
    mount(FullLayout, {
      content: <ProfileEditComposer />
    });
  }
});

（我在 Meteor/React 应用程序中使用 FlowRouter，如果您使用其他类型的路由器，代码会有点不同，但是，我相信应该是相同的想法）

以上代码行阻止未登录用户去编辑个人资料页面并将他们重定向到登录页面。通过这种方式，您无需更改 Profile-Edit 组件或所有其他组件中的代码，这可能会在这些组件尝试通过用户对象访问和循环值时产生大量错误 - 在这种情况下未定义。

Answer 2

试试

return {accounts: []};

而不是

return {};

永远不要假设accounts.length > 0。