element-ui中的el-select下拉框選中不顯示問題

最近在使用element的el-select時出現了一個奇怪的坑，就是當我選中了下拉框的內容之後但是下拉框中不展示選中的label值，具體代碼如下，先展示出現問題的代碼

<el-form-item label="推薦產品一：">
  <el-select filterable v-model="detail.recommendProductId" clearable @change="productChange">
    <el-option
      v-for="(item, key) in detail.productionData"
      :key="key"
      :label="item.name"
      :value="item.id"
    ></el-option>
  </el-select>
</el-form-item>

代碼中的this.detail是接口中返回的json數據，是一個對象，對象中也包含數組，this.detail.recommendProductId用來綁定v-model的值，同時this.detail.productionData是下拉列表的數據集合，然後在選中列表是觸發productChange函數是生效的，但是在選中之後並沒有顯示出來，產生這種現象的問題是因爲這裏的v-model綁定的值和option中的值都是變量，都通過接口來獲取的，所以就產生了選中之後不顯示的問題，解決這個問題的方法可以是將v-model綁定的值我們寫成自定的變量值，比如將detail.recommendProductId變成recommendProductId，或者將option中的數據寫死也可以解決掉這個問題