Reactjs 流星+；反应：根据登录状态显示不同的导航项

我有一个Meteor+React应用程序，其中有一个头类，如下所示：

import React, { Component } from 'react'

import { NavLoggedIn } from './header/NavLoggedIn'
import { NavLoggedOut } from './header/NavLoggedOut'

export class Header extends Component {
    render() {
        return (
            <header className="main-header">
                <nav className="navbar navbar-static-top" role="navigation">
                    <div className="navbar-custom-menu">
                        <NavLoggedIn />
                        <NavLoggedOut />
                    </div>
                </nav>
            </header>
        )
    }
}

import React，{Component}来自“React”
从“./header/NavLoggedIn”导入{NavLoggedIn}
从“./header/NavLoggedOut”导入{NavLoggedOut}
导出类头扩展组件{
render（）{
返回(
)
}
}

我有一个运行良好的帐户系统，但现在我想根据用户是否登录来更改

NavBar

的外观

我怎样才能做到这一点

即

---

如果流星用户已登录，则显示

组件。否则，显示

组件。

您需要

从'Meteor/Meteor'导入{Meteor}

，并将以下内容添加到

渲染（）函数中：

import React, { Component } from 'react'
import { Meteor } from 'meteor/meteor

import { NavLoggedIn } from './header/NavLoggedIn'
import { NavLoggedOut } from './header/NavLoggedOut'

export class Header extends Component {
    render() {
       let navigate;
        // If Meteor.userID() is null then render <NavLoggedOut />, otherwise <NavLoggedIn />
        if(Meteor.userId())
          navigate=<NavLoggedIn />;
        else
          navigate=<NavLoggedOut />
        return (
            <header className="main-header">
                <nav className="navbar navbar-static-top" role="navigation">
                    <div className="navbar-custom-menu">
                        {navigate}
                    </div>
                </nav>
            </header>
        )
    }
}

import React，{Component}来自“React”
从“Meteor/Meteor”导入{Meteor}
从“./header/NavLoggedIn”导入{NavLoggedIn}
从“./header/NavLoggedOut”导入{NavLoggedOut}
导出类头扩展组件{
render（）{
让我们航行；
//如果Meteor.userID（）为空，则渲染，否则为空
if（Meteor.userId（））
导航=；
其他的
导航=
返回(
{导航}
)
}
}
是否有任何道具来定义用户是否在线？不，我不知道如何实现。可能有来自其他组件的道具，请显示完整代码。没有来自其他组件的道具，我不知道如何实现。我只是想知道如何根据Meteor用户是否登录进行设置。我可以通过在控制台中键入
Meteor.userId（）
来查看使用ID。等等，我正在查看它我现在要测试它啊，我现在要编辑一下你的答案，看看我做了些什么来让它工作，但我仍然有一个问题，登录会给我一个问题，在登录时它不会直接更改，我必须在页面显示之前先刷新页面，这让我不确定这是否是最佳实践。但这可能并不重要，因为在登录之后，我将重新路由到主页。你想重新渲染吗？是的，基本上！有一个简单的函数吗？这类问题引出了另一个问题，因此我将对其进行一些研究。为了使这个答案有效，您需要将Meteor.userId（）调用移动到使用createContainer创建的容器中，以保持反应性。