vue select input联动

Vue 中的 select 和 input 联动可以通过监听 select 的 change 事件，然后在事件处理程序中动态更新 input 的值来实现。下面是一个简单的示例：

<template>
  <div>
    <select v-model="selectedOption" @change="updateInput">
      <option value="">请选择</option>
      <option v-for="option in options" :value="option.value">{{ option.label }}</option>
    </select>
    <input type="text" v-model="inputValue">
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedOption: '',
      inputValue: ''
    }
  },
  computed: {
    options() {
      // 返回 select 中的选项
      return [
        { label: '选项1', value: 'option1' },
        { label: '选项2', value: 'option2' },
        { label: '选项3', value: 'option3' }
      ]
    }
  },
  methods: {
    updateInput() {
      // 根据 selectedOption 更新 inputValue 的值
      this.inputValue = this.selectedOption
    }
  }
}
</script>

在上面的示例中，当 select 的选项发生变化时，会触发 updateInput 方法，该方法会根据 selectedOption 的值来更新 inputValue 的值，并将其绑定到 input 的 v-model 上，从而实现了 select 和 input 的联动。