vue中select綁定多個值及數(shù)據(jù)回顯
很久沒有寫文章了， 這篇文章主要是記錄我在項(xiàng)目中遇到的一個小問題，其實(shí)說小也不小，由于剛接觸vue和iViewUI，對于其中select如何綁定多個值我還不是很清楚，查了一下官網(wǎng)，官網(wǎng)上例子是下面這樣的：
v-model只能是value的值，又因?yàn)閷傩?label-in-value=“true” 即：在返回選項(xiàng)時，是否將 label 和 value 一并返回，默認(rèn)只返回 value，所以我就想是不是可以用label來傳遞另一個值于是我就采用了第三種方法解決了這個問題。
下面是我找到的其他兩種方法以及我使用的方法，僅供參考，如有問題還望各位不吝賜教。
?1.拼接value
后來在群里問了問，說是可以改成這樣的:value="item.value+item.label",想來大家應(yīng)該也懂這個意思，為了在傳值的時候更方便，可以把它改成這樣:value="item.value+'/'+item.label"，之后就可以很方便的這樣value.split('/')[0]取值了。
2.綁定索引
還有一種方法就是不綁定具體的值，而是去綁定索引值:value="index"，在獲取值的時候可以這樣獲取options[index].value.
3.綁定事件
3.數(shù)據(jù)回顯
以上三種方法都可以很好的解決select綁定多值的問題，但是我們不妨多想一點(diǎn)，在新增操作的時候可以這樣，那么編輯的時候怎么回顯呢？select會根據(jù)綁定值與某個option的value值是否相同來判斷是否選中，在上述兩個方法中，我們不可能為了這么一個操作讓后臺在數(shù)據(jù)庫中多存一個拼接好的value或者一個索引，想必后臺同學(xué)也不會愿意的。對于第一種方式，回顯時只需要將從后臺獲取的數(shù)據(jù)拼接在一起就行，對于第二種方式，需要去進(jìn)行循環(huán)對比，找出對應(yīng)的索引值,然后進(jìn)行賦值，而對于第三種方式，則正常獲取對象就可以了。
?4.總結(jié)
這雖然是個挺常見的問題，但對于我來說是個不小的問題，現(xiàn)在公司項(xiàng)目不那么急，抽空記錄一下。這只是我自己的想法，如果您有更好的方法，不妨分享一下。
相關(guān)鏈接：
