javascript - 在 Meteor React 组件中显示用户名

Question

我的 React 组件之一是我的主布局，我在其中显示带有当前登录用户的导航栏。问题在于，首次渲染组件时，Meteor.user() 是undefined。一旦用户对象被加载/发布，我将如何正确渲染我的导航栏？

MainLayout.jsx

import React, { Component } from 'react';

export default class MainLayout extends Component {
  render() {
    return (<div>{ Meteor.user().username }</div>);
  }
}

谢谢。

Answer 1

Meteor.user() 应该是 container component 的一部分。应将react-meteor-data包添加到项目中。

import { Meteor } from 'meteor/meteor';
import { createContainer } from 'meteor/react-meteor-data';
import MainLayout from './mainLayout';

export default MainLayoutContainer = createContainer(({ params }) => {
  return {
    user: Meteor.user(),
  };
}, MainLayout);

用户将在 MainLayout 组件中用作 props。