利用elementui,ant design的下拉給定預設值重新選擇檢視不會更新問題

CSDN_START_CC發表於2020-07-13

關於ant Design以及element-ui下拉select框初始給定一個預設值後重新選擇,select框檢視不更新問題

解決方式:

給select加@change事件;利用this.$forceUpdate() // 強制重新整理資料

下面例子是ant Design的解決方案,element一樣

 <a-select :disabled="!rule.editable"//disable根據狀態判斷它是否可編輯

                          :getPopupContainer="

                                                triggerNode => {

                                                  return triggerNode.parentNode || document.body;

                                                }

                                              "

                          @change="selectChange"//select框內容改變事件

                          v-model="rule.alarmRoleId"繫結值

                          showSearch

                          optionFilterProp="children"

                          @filterOption="selectFilterOption"

                          style="width: 300px"

                          class="m-l-10 m-r-10"

                          placeholder="請選擇">

                  <a-select-option v-for="(pos, index) in positions"

                                   :value="pos.roleType+','+pos.roleName"//如果需要給後臺傳多個值可以這樣拼接,怎麼取值後續再說

                                   :key="index + 'pos'">

                    {{ pos.roleDesc }}//這裡是檢視顯示的對於出現的

                  </a-select-option>

                </a-select>

相關文章