不直接修改state
例如,此代码不会重新渲染组件:
constructor(props) { super(props) this.state = { name: '', age: 24, exp: { year: '', job: 'web前端' } } }; componentDidMount() { this.setState({ name: '张三', }) this.setState({ age: 26, }) };
修改自身的state
setTime() { setTimeout(() => { this.setState({ name: '李四' }) }, 2000) // Correct this.setState((state, props) => ({ age: state.age + 3 })); };
State 与 Props 区别
除了State, 组件的Props也是和组件的UI有关的。他们之间的主要区别是:State是可变的,是组件内部维护的一组用于反映组件UI变化的状态集合;而Props对于使用它的组件来说,是只读的,要想修改Props,只能通过该组件的父组件修改。在组件状态上移的场景中,父组件正是通过子组件的Props, 传递给子组件其所需要的状态。