uni-app 轉h5 input每次輸入一個字符后自動失去焦點


背景:每掃一個二維碼 會在weightList數組里面添加一個對象 ,其中對象中的一個屬性值和input輸入框 進行雙向綁定。在輸入框輸入的時候,每輸入一次,輸入框就自動失去焦點了
錯誤代碼如下:
<
view v-for="(item, i) in weightList" :key="item"> <view class="bywin-column"> <view class="title"> <text>總數量</text> <text class="item-required">*</text> </view> <input v-model="item.num" class="bywin-input" placeholder="請輸入" type="number" @input="printDigitNum($event, i)" /> <text class="bywin-input" style="flex: 0 0 10%"></text> </view> </view>


printDigitNum(e, i) {
   const value = e && e.detail.value;
   this.$nextTick(() => {
      this.weightList = this.weightList.map((v, index) => ({
          ...v,
          num: parseInt(i) === parseInt(index) ? parseInt(value) : v.num,
      }));
   });
},

 

  問題原有:

    問題是有:key="item"引起,input數據綁定后進行模型更新后,view的屬性要刷新,進行渲染后就重新刷新的input。如果你是要在代碼中找view,可以直接找數組中不變的屬性為key值,而不要用子節點綁定的數據給父節點的屬性賦值。

解決方案:
 <view v-for="(item, i) in weightList" :key="'weightList'+i">
 
         

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM