学习vue的组件的时候，都会被告知，props是只读的，不能修改，而且组件内部的组件的v-model，也是不允许直接用 props 的属性的，写了会报错。

顺晟科技：

哦，你已经在用 Vue 3 了，那就是有拦截了，因为基于 Proxy 可以做到。但 Vue 2 拦截不了。

所以，为啥又单向数据流？太矛盾了。

vue的响应性不就是双向的吗？双向的不是vue的特点吗？v-model不就是要实现表单的双向绑定，双向数据流吗？

要想明白这件事，关键在于理解状态的所有方和消费方。在理想情况下，只有所有方可以修改状态（写），消费方只可以消费（读）。而 props 的场景中，父组件是状态的所有方，子组件是消费方，谁能改 props 值一目了然。emit 的存在并不是为了能让子组件修改父组件的状态，而是为了实现事件系统。只是恰好，事件系统可以用来表达对修改父组件状态的请求，而是否修改状态的决定权依然在父组件。

props的本质是只读的 reactive，所以可以监听任何修改，包括对象属性的修改。所以肯定是知道的。

修改对象属性的事，你可以试一下，Vue 是不会警告你的。

vue3的props，层是readonly的，只读，不让改，还有警告，在F12里面。

就相当于函数的参数，你想想，函数内部修改参数变量的行为，一般有什么意义，有什么影响。props 与此相似的。你修改 props 时其实往往达不到你实际想要的效果。

如果vue想要彻底禁止，那么肯定能够想出来办法禁止掉的。现在弄得又行又不行的，实在看不懂到底是啥意思。

以上是理想情况，现实显然不总是理想的，有时候你就是希望能够直接修改父组件（甚至祖父组件）的状态。所以 Vue 的响应式系统并没有拦截这种行为，仅仅是抛出一条警告。如果你修改的是对象属性，Vue 甚至都不知道你修改了。

在不增加 API 复杂度的前提下，你无法彻底禁止这种操作。权衡复杂度和限制，Vue 选择了警告但不阻止。

你说的双向数据流 v-model 的就是通过 “单向数据流+监听子组件的事件”来实现的。也就是说：<input v-model="searchText" />等价于<input :value="searchText" @input="searchText = $event.target.value" />

这是不是有点矛盾？到底是让改还是不让改？

于是有了一个“骚操作”，用 computed 的set、get方式来做中转。在get里面获取props的属性值，在set里面使用emit来修改props的值。

但是，如果说不让改的话，为啥还提供了 emit 这个方式呢？

props 是一个专用于输入的口，只负责数据从外面到内部的事项。其它需求不归它管。

所以你能够理解「单向数据流」的概念了吗？

不建议改。注意，是不建议，而不是不能。如此设计（并声明）的原因是希望用户遵守「单向数据流」的概念框架，尽可能地避免状态变化变得复杂、难以追踪。

如果你修改的是对象属性，Vue 甚至都不知道你修改了。

vue不是单向数据流吗？改porps里的值会报错的只能在数据源处修改，简单点说就是谁的数据谁改，放你那的不是给你就是简单的寄存在你那你有权查看没有权利修改

Vue 从来没有说过「双向数据流」，只有「双向绑定」，它俩不是一个意思。双向绑定是说，元素自己的状态和外部状态可以双向同步，跟父子组件没有关系。