el-table 中表格中使用 el-popover ，通过v-model控制无法点开

Question

el-table 中表格中使用 el-popover ，通过v-model控制无法点开

问题描述：在表格中通过插槽使用el-popover无法点开，同样的代码 放到表格外面就可以打开，未找到原因

放到表格内时打开

          <el-table-column fixed="right">
          <template slot-scope="scope">
            <el-popover
              :ref="`popover-${scope.row.id}`"
              v-model="visible"
              placement="top"
              width="160"
            >
              <p>这是一段内容这是一段内容确定删除吗？</p>
              <div style="text-align: right; margin: 0">
                <el-button size="mini" type="text" @click="visible = false">取消</el-button>
                <el-button type="primary" size="mini" @click="visible = false">确定</el-button>
              </div>
              <el-button slot="reference">删除</el-button>
            </el-popover>
          </template>
        </el-table-column>


data() {
    return {
      visible: false,
     }
}

放到表格外打开

    <el-popover
      v-model="visible2"
      placement="top"
      width="160"
    >
      <p>这是一段内容这是一段内容确定删除吗？</p>
      <div style="text-align: right; margin: 0">
        <el-button size="mini" type="text" @click="visible2 = false">取消</el-button>
        <el-button type="primary" size="mini" @click="visible2 = false">确定</el-button>
      </div>
      <el-button slot="reference">删除</el-button>
    </el-popover>

data() {
    return {
      visible2: false,
     }
}

Answer 1

可能是你多个组件绑定的相同的变量，你slot放在那里会渲染多个一样的组件，你可以尝试给他们分别绑定，列如scope.row.visible