element [Bug Report] el-select组件在options数据异步加载时，input里的文案不能正常回显

bybem2ql 于 2022-11-13 发布在其他

关注(0)|答案(3)|浏览(259)

Element UI version

2.15.7

OS/Browsers version

Chorme最新

Vue version

2.6.14

Reproduction Link

https://codepen.io/jaysding/pen/eYGExMW

Steps to reproduce

在value里先设定一个初始值id，然后在setTimeout里的数据回显之前，点击select的input框，然后等待options数据回显，options回来之后发现input框里的文案不能更新成label的文案

What is Expected?

回显后input框里的文案更新成label的文案

What is actually happening?

回显后input框里的文案仍然是value的文案

Element

来源：https://github.com/ElemeFE/element/issues/21567

3条答案

按热度按时间

gdx19jrr1#

遇到了相似的问题!
只要在数据没返回时打开了下拉（下面用setTimeout模拟），数据不能正常回填。

<el-select v-model="value" placeholder="请选择">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>

data() {
      return {
        options: [],
        value: ''
      }
    },
    mounted() {
      setTimeout(() => {
         this.value = '选项1';
        this.options = [{ value: '选项1', label: '黄金糕' }, { value: '选项2', label: '双皮奶'  }];
      }, 5000)
    }
  }

赞(0）回复(0）举报 2022-11-13

kqhtkvqz2#

这个问题有解吗？我看element-plus也有这个问题，人都麻了

赞(0）回复(0）举报 2022-11-13

3z6pesqy3#

相同问题，不过复现方式不一样：