想理解props和state可以点这里
1、props和state的相同点?
- props 和 state 都是导出HTML的原始数据
- props 和 state 都是确定性的,如果我们写的组件为同一props和state的组合生成了不同的输出,那木我们肯定在哪里做错了
- props 和 state 都会触发渲染更新
- props 和 state 都是纯JS对象(用typeof来判断,结果都是object)
- 可以从父组件得到初始值props和state的初始值
2、props和state的不同点?
- props 是父组件传递给子组件的数据,是只读的,子组件不能直接修改 props 的值。而state是组件内部自身管理的数据,可以被组件自身修改。
- props 是外部传入的,一旦传入,其值不能在组件内部修改。而state是组件内部的状态,可以在组件内部修改和更新。
- props 的值是由父组件传递的,当父组件props发生变化时,子组件会自动更新。而state的值是在组件内部定义和管理的,当state发生变化时,组件会重新渲染。
- props 适用于父子组件之间的通信,可以将数据从父组件传递给子组件。而state适用于组件自身的状态管理,可以在组件内部存储和更新数据。
- props 是只读的,子组件不能直接修改props的值,而state是可变的,组件可以通过setState方法来修改state的值。
总结:
Props和State都是用于存储和管理组件的数据,但Props是父组件传递给子组件的数据,是只读的,而State是组件内部自身管理的数据,可以被组件自身修改和更新。
3、render方法在哪些情况下会执行
render方法会在以下情况下执行:
- 组件初始化时,render方法会被调用一次来生成初始的DOM结构。
- 组件的state或props发生改变时,render方法会被重新调用来更新DOM结构。
- 父组件的render方法被调用时,子组件的render方法也会被调用。
- 使用forceUpdate方法强制更新组件时,render方法会被重新调用。
- 在React的生命周期方法中,如componentWillReceiveProps、shouldComponentUpdate、componentWillUpdate和componentDidUpdate中,render方法会被调用。