props 和 state 有什么区别？

Question

IT Interview Practice · Accepted Answer

两者都保存影响组件渲染的数据，但它们在**数据的所有权**和**是否可以改变**上有所不同。 - **props** 从父组件*传入*组件。它们是**只读**的 — 组件绝不能修改它们。 - **state** 由组件*内部*拥有和管理。它可以随时间而改变，改变它会触发一次**重新渲染**。 ## 示例 ```jsx // `step` is a PROP — given by the parent, the child only reads it. // `count` is STATE — owned here, changes on click, causes a re-render. function Counter({ step }) { const [count, setCount] = useState(0); return ( ); } // Parent decides the step and passes it down: ``` 数据**向下**流动（父级 → 子级通过 props），变化**向上**流动（子级通过像 `onChange` 这样的回调 prop 要求父级改变某些东西）。这种单向流动就是使 React 应用可预测的原因。 ## 为什么这很重要 - 来自上面，且组件不应该改变它 → **prop**。 - 组件必须随时间改变它 → **state**。 - 修改 props（`props.x = 1`）是一个 bug — React 不会重新渲染，而且你破坏了父级的所有权。要

示例

相关问题

为什么这很重要