vue2.5.16 控制台报错组件内不推荐修改Propsvoid mutating a prop directly since the value will be overwritten whenev

hlvy

于 2018-12-18 23:17:11 发布

阅读量624

点赞数

分类专栏： vue vue

vue 同时被 2 个专栏收录

67 篇文章

订阅专栏

vue

65 篇文章

订阅专栏

探讨了在组件内直接修改Props的反模式行为及其原因，介绍了通过Data属性和Computed属性作为替代方案的方法，以及如何在开发过程中检测并避免此类问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

修改 Props 弃用
组件内修改 prop 是反模式 (不推荐的) 的。比如，先声明一个 prop ，然后在组件中通过 this.myProp = 'someOtherValue' 改变 prop 的值。根据渲染机制，当父组件重新渲染时，子组件的内部 prop 值也将被覆盖。

大多数情况下，改变 prop 值可以用以下选项替代：

通过 data 属性，用 prop 去设置一个 data 属性的默认值。
通过 computed 属性。
升级方式
运行端对端测试，查看关于 prop 修改的控制台警告信息。

根实例的 Props 替换
对于一个根实例来说 (比如：用 new Vue({ ... }) 创建的实例)，只能用 propsData 而不是 props 。

升级方式
运行端对端测试，将会弹出 failed tests 来通知你使用 props 的根实例已经失效。