vue 下拉框通过改变事件改变下面一个下拉框，在通过改变的下拉框改变下面的下拉框

可以通过监听第一个下拉框的改变事件，然后在事件处理函数中根据选择的值动态改变第二个下拉框的选项。具体的实现方式如下：

1. 在 Vue 的模板中定义两个下拉框，并绑定对应的数据和事件处理函数：

<template>
  <div>
    <select v-model="selectedOption1" @change="changeOption1">
      <option value="">请选择</option>
      <option v-for="option in options1" :value="option">{{ option }}</option>
    </select>
    
    <select v-model="selectedOption2">
      <option value="">请选择</option>
      <option v-for="option in options2" :value="option">{{ option }}</option>
    </select>
  </div>
</template>

2. 在 Vue 的 `data` 属性中定义两个下拉框的选项和当前选中的值：

<script>
export default {
  data() {
    return {
      selectedOption1: '',
      selectedOption2: '',
      options1: ['选项1', '选项2', '选项3'],
      options2: [],
    };
  },
  // ...
}
</script>

3. 在 Vue 的方法中定义第一个下拉框的改变事件处理函数，根据选择的值动态改变第二个下拉框的选项：

methods: {
  changeOption1() {
    if (this.selectedOption1 === '选项1') {
      this.options2 = ['选项1-1', '选项1-2', '选项1-3'];
    } else if (this.selectedOption1 === '选项2') {
      this.options2 = ['选项2-1', '选项2-2', '选项2-3'];
    } else if (this.selectedOption1 === '选项3') {
      this.options2 = ['选项3-1', '选项3-2', '选项3-3'];
    } else {
      this.options2 = [];
    }
    this.selectedOption2 = ''; // 重置第二个下拉框的选中值
  },
  // ...
}

这样，当第一个下拉框的选项发生改变时，会触发 `changeOption1` 方法，根据选择的值动态改变第二个下拉框的选项，并重置第二个下拉框的选中值。