Select 选择器回显问题

新增记录时select多选下拉框正常使用，没问题。但是在编辑记录时，编辑界面也为select下拉框赋值了，却没有显示数据  以下为正确代码

      <el-form-item label="供货产品" :label-width="formLabelWidth">
              <el-select v-model="supplier.pids"
                         placeholder="请选择"
                         multiple         
                         class="selWidthd mr20">
              <el-option
                     v-for="item in productDate" 
                    :key="item.id" 
                    :value="item.id" 
                    :label="item.name" />
              </el-select>

       </el-form-item>

直接解决方法 核心思路就是 数据格式问题

下拉框中的数据源productDate是一个数组，选中后的值也是一个数组。但是在后端存储的时候是转换成字符串存到数据库中的，所以在编辑界面从后端获取的返回值是一个数组包着字符串，要把这个字符串转换成数组显示

当点击编辑按钮 进行回显时 表单赋值  

        //编辑
      update(row) {
        console.log(this.productDate)
        console.log(row)
        this.open = true
        this.isUpdate = true
        //在这里进行for循环使用方法
        let pids = row.pids.split(',')
        for (var i = 0; i < pids.length; i++) {
          pids[i] = parseInt(pids[i])
        }
        this.supplier = {
          id: row.id,
          taxNum: row.taxNum,
          accountNum: row.accountNum,
          openingBank: row.openingBank,
          name: row.name,
          phone: row.phone,
          address: row.address,
          pids:pids
        }
        console.log(this.supplier.pids)
      },

当编辑完成请求接口时候 需要再次转换数据格式

//当点击修改时
 compile() {
        this.isUpdate = false
        if (!this.supplier.name) {
          return this.$message.error("请输入供应商名称")
        }
        if (!this.supplier.address) {
          return this.$message.error("请输入供应商地址")
        }
        if (!this.supplier.phone) {
          return this.$message.error("请输入供应商电话")
        }
        if (!this.supplier.openingBank) {
          return this.$message.error("请输入供应商开户行")
        }
        if (this.supplier.pids.length < 0) {
          return this.$message.error("请选择供货产品")
        }
        if (!this.supplier.accountNum) {
          return this.$message.error("请输入供应商账号")
        }
        if (!this.supplier.taxNum) {
          return this.$message.error("请输入供应商税号")
        }
//这句话是核心哦~~~~
        this.supplier.pids = this.supplier.pids.join()
        putSupplier(this.supplier).then(response => {
          this.$message.success("修改成功")
          this.reset()
        }).catch(() => {
          return this.$message.error("修改失败")
        })
      },

附上楼主电脑锁屏界面