iView + Vue 踩坑日記，兩個Select組件聯動，第二個Select通過第一個Select的值調接口取值

• 需求：兩個Select組件聯動，Select_1數據改變了，Select_2的選項跟着改變。
• 問題：Select_2的已選擇Option依舊是之前的，並沒有達到默認選中第一項，或者不選中的預期效果。
• 解決方法：給Select_2增加v-if判斷，Select_1數據開始變化時v-if="false"卸載Select_2，獲取到數據後再v-if="true"重新渲染Select_2。

<div>
  <Select v-model="Select_1" @on-change="selectChange">
    <Option value="0">電影</Option>
    <Option value="1">電視劇</Option>
    <Option value="2">綜藝</Option>
    <Option value="3">動漫</Option>
  </Select>

  <Select v-model="Select_2" v-if="status">
    <Option v-for="(item, index) in level_two_options" :value="index" :key="index">
      {{item}}
    </Option>
  </Select>
</div>

<script>
export default {
  methods: {
    selectChange (value) {
      getData({
        'type': value
      }).then(res => {
        this.level_two_options= res.data //通過請求接口拿到Option的數據
        //這兩步是關鍵，通過切換v-if的false和true狀態，卸載Select_2然後重新加載
        this.status= false
        this.status= true
      })
    }
  }
}
</script>