javascript - child 变异一个 Vue Prop 有多危险？

Question

关闭。这个问题是opinion-based .它目前不接受答案。












想改进这个问题？更新问题，以便 editing this post 可以用事实和引用来回答它.


2个月前关闭。







Improve this question




Vue 允许改变 props，但不推荐。在文档(https://vuejs.org/guide/components/props.html#one-way-data-flow)中，我发现

As a best practice, you should avoid such mutations [mutating nested props by the child] unless the parent and child are tightly coupled by design.

对我来说，这听起来不是一个好习惯，但没关系。然而，在我发现的所有论坛帖子中，他们都说“永远不要这样做!”并且父组件的重新渲染甚至会破坏数据(即 Vue 2 - Mutating props vue-warn )。
如果由我决定，我会坚持建议而不是为此争论。然而，我工作的团队广泛使用 prop 变异。
到目前为止它有效，但我担心将来可能会出现问题。在 future 的版本中，Vue 真的会禁止这样做吗？或者他们应用了仅与遵循建议的代码兼容的细微更改？
我想知道的是，其他人如何处理对象深处变化的情况。当这是通过发射完成时，在其间的所有组件中也需要大量发射。
知道 props 突变的做法有多罕见也会很有趣。你们中有人这样做吗？

Answer 1

有 2 种突变——当你改变一个原始值(字符串、数字、 bool 值)和当你改变一个对象时。
一旦重新渲染子级，在子级内部改变原始值 Prop 将恢复来自父级的原始值。
这有多危险完全取决于你的用例——Vue 只能警告你“伙计，确保你知道你在做什么”。最终在一些下一个 Vue 版本中，他们可能会用错误代替警告——但即使是维护者也不知道何时以及是否会发生这种情况。
改变一个对象实际上是改变它的属性，因为对象是通过引用而不是值来访问的——所有来自子对象的突变都将持续存在并影响父对象(这可能不会产生这样的副作用)。同样，这完全取决于您的用例 - 但有时直接变异而不是通过发出事件向父级发送信号更方便，特别是如果变异数据在对象中更深。
对你来说唯一的风险是你应该监控你的应用程序(和浏览器的控制台)来捕捉这些来自 Vue 的警告变成错误的时刻。
最好的做法是尝试说服您的同事重构代码并尽可能避免这些突变(您可能无法摆脱所有这些突变)。