vue下拉框和输入框的联动

基于element-UI的下拉框

<el-form-item label="保险公司" prop="insuranceCompanyName" min-width="130">
          <el-select v-model="formData.insuranceCompanyName" @change="companyChange" clearable placeholder="请选择保险公司" :disabled="this.isDetail === 1" >
            <el-option
              v-for="item in companyName"
              :key="item.insuranceCompanyId"
              :value="item.insuranceCompanyName">
            </el-option>
          </el-select>
        </el-form-item>

通过change事件，进行联动，temp为当前下拉框内值，遍历company内的值，赋值与name对应的Id

companyChange (temp) {
      console.log(temp)
      this.companyName.forEach(element => {
        if (element.insuranceCompanyName === temp) {
          this.formData.insuranceCompanyId = element.insuranceCompanyId
        }
      })
    },

从数据库中取得集合

let _data = {}
    this.$http.post(this.API.getCompanyName, _data).then((response) => {
      this.companyName = response.data.data
    }).catch((response) => {
      console.log(response)
      this.$message.error('网络异常')
    })