element-ui popover Q:"Cannot set property 'reference' of undefined"

<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>

 

posted @ 2017-03-11 14:23  Chiatta  阅读(3061)  评论(6)    收藏  举报