遍历数组中使用el-popover，出现多个弹框

        <el-select v-model="setup.groupId" placeholder="请选择分组" size="medium">
          <el-option v-for="(op, index) in fromGroup" :key="index"
                     :label="op.groupName" :value="op.id">
            <span style="float: left">{{ op.groupName }}</span>
            <span style="float: right; color: #8492a6; font-size: 13px">
              <el-popover placement="bottom-end" title="编辑分组" :ref="`popoverEdit-${index}`" width="300" trigger="click">
                <el-input size="medium" v-model="newGroup" placeholder="请输入新的分组名">
                  <el-button slot="append" size="medium" type="primary" @click="addGroup(`popoverEdit-${index}`)">提交</el-button>
                </el-input>
                <el-button slot="reference" type="text" @click.stop.prevent="closePopover(op,index)">编辑</el-button>
              </el-popover>
              <el-button type="text" style="color: #d70505;margin-left: 10px;" @click.stop.prevent="deleteGrou(op)">删除</el-button>
            </span>
          </el-option>
        </el-select>

  closePopover(item,index) {
      // 每次只显示一个Popover弹窗 使用doClose()
      // 遍历所有的refs，判断索引名中是否有 'popoverEdit-' ;如果有，都使用doClose关掉
      for (const key in this.$refs) {
        if (key.indexOf('popoverEdit-') !== -1) {
          this.$refs[key][0].doClose();
        }
      }
    },