我编写了以下React测试组件:
import React from 'react'; class NavBar extends React.Component { constructor() { super(...arguments); } render() { let d = new Date().toLocaleString(); let user = this.props.user || null; if (user) { console.log(user); } return <div> {user ? <div>Hello, {user.first_name}!</div> : <div>Hello, stranger.</div>}<br/> Time: {d} </div> } } export default NavBar;
会发生什么:当组件收到更新的属性时,render()
方法始终按预期更新。我知道,因为UI中的“时间”值会发生变化。我也知道this.props.user
具有有效值,因为控制台会记录用户数据。
奇怪的是用户的显示不会改变:组件总是显示“Hello,stranger”。
有什么想法吗?