Javascript 登录后显示新链接[REACT]

我正在REACT中创建登录表单。将对照数据库记录检查电子邮件/密码，如果登录成功，我希望存储会话并在标题中显示指向额外组件的链接。我得到了这个工作，但每次登录/注销后，我需要手动刷新浏览器以显示额外的链接。有人能指出我做错了什么吗

Login.js

 fetch('http://localhost:5000/getUsers')
            .then((data) => data.json())
            .then((data) => {
                // console.log(data);
                return data.filter(user => (user.EMAIL === email && user.PASSWORD === password));
            })
            .then((data) => {
                if (data.length === 1) {
                    localStorage.setItem('user', data[0].EMAIL);
                    localStorage.setItem('isLoggedIn',true);
                    this.setState({email:data[0].EMAIL, password: data[0].PASSWORD, isLoggedIn: true })

在我的路线中

const routing = (
  <Router>
    <div>
        <Header name={localStorage.getItem("user")}  />

const路由=(

在Header组件中

this.state = {
            name : this.props.name
        }

{(this.state.name !== "") ?
                    <li> <a href="/updateLiveGames">Update Live Games</a></li>
                    :
                    ""
                }

this.state={
名称：this.props.name
}
{（this.state.name！==“”）吗？

:
""
}

这可以工作，但我需要刷新浏览器（F5）

谢谢你的帮助

我希望只有在用户登录时，才能登录用户并在标题中显示额外链接。

在标题组件中 不要设置状态，使用props.name如下：

{(this.props.name !== "")
  ? <li> <a href="/updateLiveGames">Update Live Games</a></li>
  : ""
}

在路由中，您应该得到：

<Login setLoginData={this.setLoginData} />

setLoginData = (name) => {
  this.setState({name});
}

setLoginData=（名称）=>{
this.setState（{name}）；
}

并将此.state.name传递给标头组件：

<Header name={this.state.name}  />

<Header name={this.state.name}  />