Vue有没有判断是否需要外层包裹的简单写法?

Question

比如下边这段代码，hasPopover为true时，test按钮组件hover时会有Popover弹出框，hasPopover为false时test按钮组件正常显示。

 <el-popover
    v-if="hasPopover==true"
    placement="top-start"
    title="标题"
    width="200"
    trigger="hover"
    content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。">
    <el-button slot="reference">test</el-button>
  </el-popover>
<el-button v-else>test</el-button>

但这种写法在插槽内部的代码需要写两遍，感觉有点冗余，有没有简单的写法能将插槽拆分出来的？

Answer 1

el-popover有disabled属性，不知道你是不是要这种效果

 <el-popover
    :disabled="hasPopover"
    placement="top-start"
    title="标题"
    width="200"
    trigger="hover"
    content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。">
    <el-button slot="reference">test</el-button>
  </el-popover>

https://element-plus.org/zh-C...