Vue.js Select 联动：第一个 Select 切换选项后第二个 Select 显示空，如何解决？

要实现两个 select 联动的功能，可以使用 Vue 的 v-model 指令和 watch 监听器来实现。

首先，在 Vue 实例的 data 属性中定义两个变量，用来绑定 select 的选中值：

data() {
  return {
    firstSelect: '',
    secondSelect: '',
    // 其他数据...
  }
}

然后，在模板中使用 v-model 指令将 select 和数据进行绑定：

<select v-model='firstSelect' @change='updateSecondSelect'>
  <!-- 第一个 select 的选项 -->
</select>

<select v-model='secondSelect'>
  <!-- 第二个 select 的选项 -->
</select>

接下来，定义一个方法 updateSecondSelect，在第一个 select 的选中值发生改变时调用该方法，用来更新第二个 select 的选项：

methods: {
  updateSecondSelect() {
    // 根据第一个 select 的选中值，更新第二个 select 的选项
    // 这里可以根据具体的需求进行数据处理，例如从 API 获取数据等
  }
}

最后，使用 watch 监听器来监测第一个 select 的选中值的变化，当其发生改变时，调用 updateSecondSelect 方法：

watch: {
  firstSelect: function(newVal, oldVal) {
    this.updateSecondSelect();
  }
}

这样，当第一个 select 的选中值发生改变时，会自动调用 updateSecondSelect 方法来更新第二个 select 的选项。