el-table header中使用el-popover时el-popver无法更新数据的问题

425 阅读1分钟

踩坑笔记: el-table header中使用el-popover时el-popver无法更新数据的问题

  • 问题:在el-table表头处使用插槽<template slot="header"></template>,点击后展示el-popover 弹窗。数值变化后发现,el-popover中的内容并未响应式发生改变。
  • 解决:将具名插槽slot="header"换成作用域插槽#header,两者的区别在于具名插槽不绑定数据,作用域插槽父组件只需要提供一套样式
    <el-popover
      placement="top-start"
      width="550"
      trigger="click"
      @show="getSelfLiveRoomFeeByLiveId"
    >
      <span class="fc-main pointer mg-left-10" slot="reference">
        自定义表头
        <i class="el-icon-d-arrow-right"></i>
      </span>
      <liveFeeContent :tableList="tableList"></liveFeeContent>
    </el-popover>
  </template>