vue 如何用v-model绑定数组对象中的未提前定义的属性

最新推荐文章于 2024-07-19 11:46:42 发布

Seven_5477

最新推荐文章于 2024-07-19 11:46:42 发布

阅读量4.1k

点赞数

分类专栏： Vue 文章标签： vue javascript html 前端

本文链接：https://blog.csdn.net/m0_37922443/article/details/117742997

版权

Vue 专栏收录该内容

26 篇文章 1 订阅

订阅专栏

原本的代码：

html：

<ul class="advance-ul" v-for="(item,index) in terminal_list">
	<li class="trText">{{item.ip}}</li>
	<li class="trText">
		<input type="text" v-model="item.enable"/>
    </li>
</ul>

js中的data里的表的定义：

terminal_list: []

由于获取到的terminal_list是一个数组对象，但根据需求，数组里的数据没法提前定义，所以v-model这样绑定是无法生效的。

解决方法： 根据index去找到数组的项，再绑定这一项的属性。

<ul class="advance-ul" v-for="(item,index) in terminal_list">
	<li class="trText">{{item.ip}}</li>
	<li class="trText">
		<input type="text" v-model="terminal_list[index].enable"/>
    </li>
</ul>