meteor - Meteor React 组件在注销时未更新

Question

我有一个页面，它将根据用户是否登录或退出显示不同的组件。

在渲染区域我有：

 var layout;
 if (Meteor.userId()) {
    layout = <BoxSignedIn />;
 } else {
    layout = <BoxSignedOut />;
 }

 return (

            layout                               
        ) 
  }

现在，如果我退出并刷新应用程序，这确实有效，但如果我只是退出并且不刷新，它将不起作用。

这是已登录组件的代码：

从“反应”导入反应；从 'react-dom' 导入 ReactDOM；

export default class BoxSignedIn extends React.Component{

constructor(){
 super();   
 }

render(){   
 return (   
                   <div>signed in </div>

        ) 
}
}

Answer 1

这是因为 React 仅在其状态或道具发生变化时更新组件，但Meteor.userId()两者都不是。你需要使用createComponent来Meteor.userId()变成一个 React 属性。

import React from 'react';
import { Meteor } from 'meteor/meteor';
import { createContainer } from 'meteor/react-meteor-data';

class MyComponent extends React.Component {
  render() {
    return this.props.userId ? <BoxSignedIn /> : <BoxSignedOut />;
  }
}

export default createContainer(() => {
  return {
    userId: Meteor.userId()
  };
}, MyComponent);