elementui如何在table中使用正确使用popover

背景:elementui 在table 中使用popover进行信息二次确认时点击确定、取消按钮存在bug,导致弹窗一直无法关闭。

使用方法:

      <el-table-column fixed="right" label="操作" width="210">
        <template slot-scope="scope">
          <el-popover
            popper-class="popper-class"
            placement="top"
            width="240"
            :ref="`popover-audit-${scope.row.id}`"
            >
            <div>
              <p>请选择审核意见</p>
              <div style="text-align: right; margin: 0">
                <el-button type="text" size="mini" @click="cancel()">取消</el-button>
                <el-button type="primary" size="mini" @click="cancel()">确定</el-button>
              </div>
            </div>
            <el-button 
              type="text" 
              size="small"
              slot="reference"
            >审核</el-button>
          </el-popover>
        </template>
      </el-table-column>


      cancel(){
        document.body.click()
      }

解决方案本质是模拟了点击弹窗外区域弹窗关闭的方法。


版权声明:本文为gmm851773170原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。