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>