Element中form表单下拉框（value，label）的转化

要的是这样一个效果：

现在出现的问题：

下拉框中显示label名称，传递的值是value值，随着下拉框选中某个值，输入框同步显示选中的值。 原始写的死数据：

<el-form-item
  label="机构名称"
  :required="true"
  style="margin-bottom: 0"
>
  <el-select v-model="testForm.jgmc">
    <el-option label="名称1" value="value1"></el-option>
    <el-option label="名称2" value="value2"></el-option>
  </el-select>
</el-form-item>
<el-form-item>
  <span slot="label">
    <span style="color: #f56c6c; font-size: 14px"> * </span>
  </span>
  <el-input
    style="margin-top: 5px"
    v-model="testForm.jgmc"
  ></el-input>
</el-form-item>

这样下拉框能选中，但是输入框不联动

解决方法：

<el-form-item label="机构名称" style="margin-bottom: 0">
  <el-select v-model="testForm.ggmc">
    <el-option
      v-for="(option, index) in options"
      :key="index"
      :value="option.value"
      :label="option.label"
    >
    </el-option>
  </el-select>
</el-form-item>
<el-form-item>
  <span slot="label">
    <span style="color: #f56c6c; font-size: 14px"> * </span>
  </span>
  <el-input
    style="margin-top: 5px"
    v-model="displayedText"
  ></el-input>
</el-form-item>

  data() {
    return {
      options: [
        { label: "名称1", value: "value1" },
        { label: "名称2", value: "value2" },
      ]
      // displayedText: ""
    };
  },
  computed: {
    displayedText() {
      const option = this.options.find(option => option.value === this.auctionForm.ggmc);
      return option ? option.label : '';
    }
  }