在el-table中嵌套使用el-popover的坑与解决方案(v-model显示失效)在el-table中嵌套使用el

实现效果

常规情况下，row中的visible属性会发生改变，但通过调试发现row属性并未改变，查看源码，我们直接修改this.showPopper的布尔值。

直接给el-popover绑定ref+改变DOM元素上的showPopper属性(并且ref是唯一的值)

 <el-popover width="400" trigger="click" title="备注" placement="left" :ref="`popover-${data.id}`" @show="open_note(data)">
     <el-input v-model="remarkData.remark" type="textarea" :rows="4" :col="70" placeholder="备注内容" /> 
         <div class="note">
            <el-button @click="cancel_Remark(data)">取消</el-button>
            <el-button @click="handler_Remark(data)" type="primary">确定</el-button>
         </div>
     <el-button slot="reference" type="text">备注</el-button>
 </el-popover>
 
 
  // js部分
  // popover取消
    cancel_Remark(row) {
      this.$refs["popover-" + row.id].showPopper = false; //通过这个来控制是否显示
      this.remarkData = {
        id: "",
        remark: "",
      };
    },

原文地址