Question

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

在渲染区域我有：

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

 return (

            layout                               
        ) 
  }

现在，如果我退出并刷新应用程序，但是如果我只是退出并且不刷新，则无效。

以下是已登录组件的代码：

从'react'导入React; 从'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);

Meteor React组件在注销时未更新

1 个答案: