鍍金池/ 問答/HTML5  HTML/ vue.js在element UI中的select中的每個循環(huán)體怎么獨立起來

vue.js在element UI中的select中的每個循環(huán)體怎么獨立起來

在element UI中的select中的每個循環(huán)體怎么獨立起來
我循環(huán)之后數(shù)據(jù)共享了,原因是用的都是一個數(shù)組,我怎么才能不用一個數(shù)組呢,因為數(shù)據(jù)都是push

clipboard.png

clipboard.png

頁面的效果是這樣的

clipboard.png

每次一選擇之后都同步了,問怎么
我每次點擊
clipboard.png

clipboard.png

我是這樣添加的,還有問題就是我怎么把每個文本框里面的數(shù)據(jù)拿到呢,我現(xiàn)在也拿不到數(shù)據(jù)了,循環(huán)的問題還是、?

回答
編輯回答
孤慣

v-model='value'
如果你的所有select都是這樣寫的,那么只要一個變了 全部都一起動,解決方法就是
select1 v-model='value1'
select2 v-model='value2'
...
...
以此類推。
建議還是看一下vue官方文檔多寫幾個的demo吧。

2017年9月2日 08:51
編輯回答
空白格

你的option是基于靜態(tài)數(shù)據(jù)循環(huán)的,但是每個任務看起來并不是基于新的對象進行添加的。

這樣看起來每個任務其實都是vue監(jiān)聽的同一個對象,所以改變select其他的也會跟著變。

vue實例中data被監(jiān)聽的對象不經(jīng)過深復制始終只有一份,所以你的list里很有可能只是添加了四個同一個對象的引用,這些引用指向同一個被監(jiān)聽的數(shù)據(jù),所以實質(zhì)上輸入框應該也是共享的吧。

另外我仔細看了一下,select綁定的是一個叫value的值,options是基于items循環(huán)的。那么你設想一下,如果所有的select綁定的都是這個value,那是不是就共享了。

循環(huán)你可以不用管了,items是靜態(tài)輸出,不會影響最終你選擇的值是多少,更不會直接影響其他select的value

推薦你在檢查一下添加任務的邏輯,不要試圖將被監(jiān)聽的對象push到數(shù)組中,因為你永遠push的都是引用。這種情況一般做法都是暫存一個任務模板,然后添加的時候基于那個模板進行深拷貝在push到數(shù)組

2017年3月7日 09:46