Javascript 道具更改时重新启用功能部件

当传递给子组件的父状态发生更改时，我无法重新命名组件。MapNav组件包含触发更改当前显示弹出窗口的方法的按钮。我的问题是，当有人单击zaloguj或wyloguj时，重新渲染UserPopup按钮，它应该可以工作，但它不能工作，我无法找出问题所在，我也不想在isLoggedIn状态更改时触发动画，还有一件事是登录方法正确更改状态。isLoggedIn状态只是暂时的，稍后我将更改为使用store。我试图编写尽可能多的功能组件，但在某些情况下，我无法避免使用状态，我敢打赌我的代码中存在问题，因此我将感谢所有改进技巧

constmapnav=（道具）=>{
返回








}
const UserPopup=（道具）=>{
返回
{（props.isLoggedIn）(
扎洛戈瓦尼
威洛古
) : (
尼扎洛戈瓦尼
扎洛古伊
)
}
;
};
功能欢迎（道具）{
返回
信息自动更新。
基本面板示例
;
}
类MapHeader扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
currentPopup:null，
伊斯洛格丁：错，
用户名：'gregorowicz。k@gmail.com',
};
this.onInfoClick=this.onInfoClick.bind（this）；
this.onUserIconClick=this.onUserIconClick.bind（this）；
this.logIn=this.logIn.bind（this）；
}
OnInfo点击=（e）=>{
e、 预防默认值（）；
这个.setPopup（）；
}
onUserIconClick=（e）=>{
e、 预防默认值（）；
const loginPopup=；
此.setPopup（loginPopup）；
}
setPopup=（obj）=>{
this.state.currentPopup==null？this.setState（{currentPopup:obj}）：this.setState（{currentPopup:null}）；
}
登录=（e）=>{
this.setState（{isLoggedIn:！this.state.isLoggedIn}）；
}
render（）{
返回(
切换导航
{MapNav（{onInfoClick:this.onInfoClick，onUserIconClick:this.onUserIconClick}）}
{this.state.currentPopup？this.state.currentPopup:null}
)
}
}
//渲染它
ReactDOM.render(
,
document.getElementById（“react”）
);
我已经解决了。在我的代码中有一个currentPopup状态，它存储了当前显示的弹出窗口，要查看更改，我必须在isLogggedIn状态更改后卸载并再次装载组件，所以我更改了显示当前弹出窗口的方式。我只存储提供有关当前组件信息的简单字符串值，而不是以状态存储整个组件。无论如何，谢谢你的提示，我一定会在我的代码中应用它们


constmapnav=（道具）=>{
返回








}
const UserPopup=（道具）=>{
返回
{（props.isLoggedIn）(
扎洛戈瓦尼
威洛古
) : (
尼扎洛戈瓦尼
扎洛古伊
)
}
;
};
功能欢迎（道具）{
返回
信息自动更新。
基本面板示例
;
}
类MapHeader扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
currentPopup:null，
isLoggedIn:null，
};
this.onInfoClick=this.onInfoClick.bind（this）；
this.onUserIconClick=this.onUserIconClick.bind（this）；
this.logIn=this.logIn.bind（this）；
}
OnInfo点击=（e）=>{
e、 预防默认值（）；
this.setState（{currentPopup:this.state.currentPopup==='info'？null:'info'}）；
}
onUserIconClick=（e）=>{
e、 预防默认值（）；
this.setState（{currentPopup:this.state.currentPopup==='user\u login'？null:'user\u login'}）；
}
setPopup=（obj）=>{
this.setState（{currentPopup:this.state.currentPopup==='user\u login'？null:'user\u login'}）；
}
登录=（e）=>{
this.setState（{isLoggedIn:！this.state.isLoggedIn}）；
}
render（）{
返回(
切换导航
{MapNav（{onInfoClick:this.onInfoClick，onUserIconClick:this.onUserIconClick}）}
{this.state.currentPopup=='info'？：null}
{this.state.currentPopup==='user\u login'(
)：null}
)
}
}
//渲染它
ReactDOM.render(
,
document.getElementById（“react”）
);
我已经解决了。在我的代码中有一个currentPopup状态，它存储了当前显示的弹出窗口，要查看更改，我必须在isLogggedIn状态更改后卸载并再次装载组件，所以我更改了显示当前弹出窗口的方式。我只存储提供有关当前组件信息的简单字符串值，而不是以状态存储整个组件。无论如何，谢谢你的提示，我一定会在我的代码中应用它们


constmapnav=（道具）=>{
返回








}
const UserPopup=（道具）=>{
返回
{（props.isLoggedIn）(
扎洛戈瓦尼
威洛古
) : (
尼扎洛戈瓦尼
扎洛古伊
)
}
;
};
功能欢迎（道具）{
返回
信息