[plugin:vite:vue] v-model cannot be used on v-for or v-slot scope variables because they are not writable.
时间: 2024-11-30 11:22:29 浏览: 85
`v-model` 无法直接用于 `v-for` 或者 `v-slot` 的作用域变量,因为这些变量通常是只读的[^1]。在 Vue 中,如果你想要在循环渲染的元素上绑定 `v-model`,你应该绑定到每个独立的对象属性上,而不是尝试直接操作数组索引。
对于字符串数组的情况,你应该这样修改你的代码:
```html
<div v-for="(item, index) in ['111', '222']" class="wordTag" @close="delWord(index)">
<el-input v-model="item"></el-input>
</div>
```
这里使用 `item` 直接绑定到字符串本身,而不是 `item[index]`,避免了错误。
对于对象数组,如果要绑定到 `name` 属性:
```html
<div v-for="(item, index) in [{ id: 1, name: '111' }, { id: 2, name: '222' }] class="wordTag" @close="delWord(index)">
<el-input v-model="item.name"></el-input>
</div>
```
同样地,`v-model` 应该绑定到对象的可写属性上,这里是 `name`。
至于 Vue3 的 `.eslintrc.js` 配置中提到的问题,由于 Vue3 支持更灵活的模板,可能需要更新你的配置以适应 Vue3 的特性。`vue3-recommended` 插件应该已经处理了大部分兼容性问题,但可能仍需调整其他部分来适应 Vue3 的新语法[^2]。具体来说,你可以检查是否有与 Vue3 兼容性冲突的规则,比如对单文件组件(SFC)的处理方式。
阅读全文