<template v-if="scope.row.type == 'tocontain'"> {{scope.row.source}} <el-tag type="primary">包含</el-tag> {{scope.row.target}} <el-popover ref="popover4" placement="top" width="160" v-model="scope.row.dialogVisible"> <p>確定刪除這條信息嗎?</p> <div style="text-align: right; margin: 0"> <el-button size="mini" type="text" @click="updateVisible">取消</el-button> <el-button type="primary" size="mini" @click="deleteContainRelationship(scope.row.relationshipId)">確定</el-button> </div> </el-popover> <el-button v-popover:popover4 type="text" size="small" style="float:right">刪除</el-button> </template>
解決:使用slot
<template v-if="scope.row.type == 'tocontain'"> {{scope.row.source}} <el-tag type="primary">包含</el-tag> {{scope.row.target}} <el-popover placement="top" width="160"> <p>確定刪除這條信息嗎?</p> <div style="text-align: right; margin: 0"> <el-button size="mini" type="text" @click="updateVisible">取消</el-button> <el-button type="primary" size="mini" @click="deleteContainRelationship(scope.row.relationshipId)">確定</el-button> </div> <el-button slot="reference" type="text" size="small" style="float:right">刪除</el-button> </el-popover> </template>