间接修改 v-model 是一种反模式吗？答案

【问题标题】：Is modifying v-model indirectly an anti pattern?间接修改 v-model 是一种反模式吗？
【发布时间】：2022-07-14 13:59:21
【问题描述】：

在 Vue 3 中，以下代码行会产生错误：

<input v-model="modelValue[idx].name" v-for="(item, idx) in modelValue" :key="idx">

错误如下：

error  Unexpected mutation of "modelValue" prop  vue/no-mutating-props

这是有道理的，因为修改属性值被认为是一种反模式： https://v2.vuejs.org/v2/guide/migration.html#Prop-Mutation-deprecated

然而，以下代码行编译并运行良好：

<input v-model="item.name" v-for="(item, idx) in modelValue" :key="idx">

我仍然修改同一个对象，唯一的区别是我间接引用它。这可以吗，或者这是 linter 未能检测到的反模式？

【问题讨论】：

标签： vue.js

【解决方案1】：

我在文档中找到了答案：

警告请注意，JavaScript 中的对象和数组是通过引用传递的，因此如果 prop 是数组或对象，则在子组件内改变对象或数组本身会影响父状态，Vue 无法对此发出警告。作为一般规则，您应该避免改变任何道具，包括对象和数组，因为这样做会忽略单向数据绑定并可能导致不希望的结果。

【讨论】：