element ui select组件自定义data的问题?

回答2

• 
  @fei1024

  贴下代码是最好的了。

  一个办法是你可以使用计算属性来计算出select的选项，假设搜索得到的列表是list, 关键字是keyword, 在list前面加上这个a：

  computed: {
    options () {
      if (!this.keyword) return this.list
      return [{
        lable: `${this.keyword}（自定义）`,
        value: 'xxx'
      }].concat(this.list)
    }
  
  }
  

  另一个方法是在el-option上做判断，判断为前端添加的数据则加上自定义。

  支持 0 反对 0 举报

  2021-11-28 09:52

• 
  
  @jowsing

  代码如下:

          <el-select
            style="width:100%"
            v-model="postData.mailReceiver"
            multiple
            clearable
            @clear="clearMailReceiverStorage"
            :loading="loading"
            allow-create
            filterable
            remote
            default-first-option
            placeholder="请输入邮箱地址"
            :remote-method="remoteSearchMail"
          >
            <el-option v-for="item in options" :key="item.id" :label="item.email" :value="item.email"></el-option>
          </el-select>
  

  经实验检测 allow-create 创建的数据并不是concat到 从后端查询返回的数据中

  支持 0 反对 0 举报

  2021-11-28 11:09