【每日一题】为什么前端框架里的Props是只读的

Props是只读属性，内部不能直接修改

vue / React中，Props在子孙组件中的设计都是只读属性、内部不能直接修改。要想修改 Props，只能在该组件的上层组件中进行修改。

单向数据流 Unidirectional data flow

这是因为，props 是上层组件传递进来的值，这个值是父类的值。props 的传值遵从单向数据流 (Unidirectional data flow)的设计模式，也就是数据只能从上流到下、从外流到内这样沿着一个方向传递，而不能“逆流”。即不会让内部影响外部的值，这样能使状态可预测。

试想一下，如果允许子组件修改父组件的数据，那么当我们将一个父组件的状态传递给好几个子组件后，这几个子组件随意修改数据，就会导致状态完全不可预测、根本不知道在什么地方修改什么状态的混乱场景。

修改props的值

如果需要改值，只能从外部到内部这一个方向去修改值：在vue中可以用$emit和自定义事件配合修改；
在React中可以向子组件传递并调用父组件的函数进行修改。

也可以在子组件内，先把 props 赋值给一个变量，再修改这个变量。