猿问

vue如何在for循环中将指定元素作为计算值

如现在页面上有多个input,我是用element做的,不影响,下面做一个简写

<el-input-number class='ipt'
    v-for="(item,index) in arr"
   v-model.number="item.value"
   :controls="false"
   :precision="2"
   controls-position="right"
   :min="0">
</el-input-number>

arr=[
    {"value"="","name"="main"},
    {"value"="","name"="first"},
    {"value"="","name"="second"},
    {"value"="66","name"="a"},
    {"value"="66","name"="b"},
    {"value"="66","name"="c"}
]

最终要达成的目的,就是在for循环的这些input中,name=main这个input是不可编辑的,而name=first和name=second这两个input是可编辑的,name=main的值由first+second动态完成,应该如何解决呢?

补全一下,不能用index来做,是我疏忽了,必须要利用绑定值来完成


慕妹3146593
浏览 718回答 1
1回答

qq_笑_17

如果单纯只是你说的意思:<template> &nbsp;&nbsp;<div> &nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;v-for="(item,&nbsp;index)&nbsp;in&nbsp;plusArr"&nbsp;:key="index"&nbsp;v-model="item.value"> &nbsp;&nbsp;</div></template><script>export&nbsp;default&nbsp;{&nbsp;&nbsp;props:&nbsp;{},&nbsp;&nbsp;components:&nbsp;{}, &nbsp;&nbsp;data&nbsp;()&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;arr:&nbsp;[ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{&nbsp;'value':&nbsp;'1',&nbsp;'name':&nbsp;'main'&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{&nbsp;'value':&nbsp;'2',&nbsp;'name':&nbsp;'first'&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{&nbsp;'value':&nbsp;'3',&nbsp;'name':&nbsp;'second'&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{&nbsp;'value':&nbsp;'66',&nbsp;'name':&nbsp;'a'&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{&nbsp;'value':&nbsp;'66',&nbsp;'name':&nbsp;'b'&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{&nbsp;'value':&nbsp;'66',&nbsp;'name':&nbsp;'c'&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;] &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;},&nbsp;&nbsp;computed:&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;plusArr&nbsp;()&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.arr.forEach((element,&nbsp;index)&nbsp;=>&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.arr[0].value&nbsp;=&nbsp;parseInt(this.arr[1].value)&nbsp;+&nbsp;parseInt(this.arr[2].value) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;})&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;this.arr &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;}, &nbsp;&nbsp;created&nbsp;()&nbsp;{ &nbsp;&nbsp;},&nbsp;&nbsp;methods:&nbsp;{} }</script>
随时随地看视频慕课网APP

相关分类

Html5
Vue.js
我要回答