element的el-select input組件雙向綁定無法選中回顯的問題

在選擇下拉后出現了下拉無法回顯的情況,但是其他輸入框一填內容,馬上就回顯了的情況。

經過排查也並不是下拉框綁定的值有問題,最后是使用了Vue 官方提供了 vm.$forceUpdate() 方法才解決的。
此方法的作用是迫使 Vue 實例重新渲染。

解決代碼:
在對應的select組件增加@change事件，在對應的input組件增加@input事件，事件對應為$forceUpdate()即可

                <el-select
                  v-model="ruleForm"
                  placeholder="請選擇"
                  clearable
                  @change="$forceUpdate()"
                >
                  <el-option
                    v-for="item in Options"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>

 

 

參考鏈接：https://blog.csdn.net/d_append/article/details/107262018