這篇文章將為大家詳細(xì)講解有關(guān)如果在vue中獲取input的輸入值，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關(guān)知識有一定的了解。

站在用戶的角度思考問題，與客戶深入溝通，找到西固網(wǎng)站設(shè)計(jì)與西固網(wǎng)站推廣的解決方案，憑借多年的經(jīng)驗(yàn)，讓設(shè)計(jì)與互聯(lián)網(wǎng)技術(shù)結(jié)合，創(chuàng)造個性化、用戶體驗(yàn)好的作品，建站類型包括：成都網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣、主機(jī)域名、虛擬空間、企業(yè)郵箱。業(yè)務(wù)覆蓋西固地區(qū)。

vue獲取input輸入值的問題解決辦法

v-for里有多行input輸入框，vue怎么獲取某行的輸入的值，隨便寫了點(diǎn)代碼，意思就是后臺返回了多行的list集合，頁面顯示多行輸入框，當(dāng)修改某行的值時進(jìn)行校驗(yàn)，輸入錯誤友好提示下，后邊加個清空按鈕，點(diǎn)擊清空當(dāng)前行數(shù)據(jù)，最開始的想法是，用v-bind:value綁定值，這樣就出現(xiàn)一種情況，頁面輸入的值無法獲取到，v-bind不會修改原始list里的值，而且ref也不能動態(tài)綁定，ref只能全部獲取，this.$refs.itemPriceRef[]，這樣取的是所有輸入框的值，是個數(shù)組，可以在提交前進(jìn)行驗(yàn)證，但是無法判斷某一行操作，并且vue操作DOM元素非常非常差，找了N多資料愣是沒找到獲取值的方法，最后發(fā)現(xiàn)用v-model直接綁定list里的值問題解決了，這樣在修改時會直接修改list里的值，就不存在輸入值和原始值不同的問題了，VUE在綁定值方面做挺方便的，剛開始學(xué)vue，用的不熟練，沒想到這種方法，浪費(fèi)了好多時間，不過也學(xué)會了很多東西。

PS:總結(jié)了3種方式獲取頁面輸入框的值，1是用v-bind:value + ref方式獲取，這種只適用有具體的輸入框才行，

比如登錄頁，只有帳號密碼輸入框，

2是用v-model方式獲取，這種是修改原始list值，所以在提交時，還需要遍歷下原來的list，有點(diǎn)麻煩，

3是用v-model + ref 就是我寫的這樣，和2的區(qū)別是在提交時，直接用ref取值，感覺在未知數(shù)量的輸入框時更好用

自己隨便總結(jié)了下，估計(jì)在大神看來不值一提，但是對于我一個剛學(xué)習(xí)vue的人來說，確實(shí)浪費(fèi)了我挺長時間，

花點(diǎn)時間記錄下來，加深下印象。

 
 
 
價格：