el-input 輸入框不能輸入值

前端代碼是這樣,通過循環將dbpmInfo的值給傳遞進去。

 <el-form label-width="140px">
      <el-form-item
        v-for="(dbpmInfo,index) in tabMain"
        v-show=" dbpmInfo.cur.indexOf(tabPosition) > -1"
        :key="index"
        label="temp"
      >
        <!-- 作用域插槽,綁定數據在插槽展示 -->
        <span slot="label">{{ dbpmInfo.name }}</span>
        <el-input
          type="text"
          v-show=" dbpmInfo.cur.indexOf(tabPosition) > -1"
          style="width:200px"
          :model="dbpmInfo.value"
        ></el-input>
      </el-form-item>
    </el-form>

但是用v-model雙向綁定之後,在前端頁面就不能輸入值了。

export default {
  data() {
    return {
      tabPosition: '0',
      tabTitle: [
        '啓動任務',
        '一鍵完成任務',
        '指定場景完成任務',
        '一鍵結束任務'
      ],
      tabMain: [
        { name: '輸入場景id', cur: '0,1', value: '5' },
        { name: '輸入商家id', cur: '0,1,3', value: '1' },
        { name: '輸入門店id', cur: '0,1', value: '12' },
        { name: '選擇人員類型', cur: '0,1,3', value: '' },
        { name: '輸入人員ID或崗位ID', cur: '0,1,3', value: '' },
        { name: '可輸入崗位屬性', cur: '0,1', value: '' },
        { name: '輸入生成任務條數', cur: '1', value: '' },
        { name: '指定完成節點數', cur: '1', value: '' },
        { name: '指定判定條件', cur: '0,1', value: '' }
      ]
    }
  },
  methods: {
    changeTab(index) {
      console.log('index:', index)
      this.tabPosition = index
    },
  }
}

百度了很久,找了很多答案,最高票的答案就是 this.$forceUpdate(),說的是組件嵌套太深入了,沒有辦法渲染。我試了這樣的解決方案各種方式,但是都沒有解決我的問題;
在這裏插入圖片描述

幸好我昨天讀了stack flow 的如何提好一個問題的文檔
如何優雅的再stack flow 提出技術問題

我在嘗試各種方法之後,百度和google 都不行的情況下,去
element-ui文檔
再次重新看了一遍文檔,看了三遍之後,發現文檔首頁赫然寫着幾個大字!
在這裏插入圖片描述
不支持v-model 修飾符,什麼是v-model修飾符?:model?
我將input 的表達式改成 v-model之後一切正常。
究其原因,還是基礎不牢,之前看視頻,以爲v-model 和:model沒有任何區別,區別就是":" 是簡寫!
以後有問題還是先看文檔,再百度。不能無腦百度,無腦嘗試。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章