iView的Poptip气泡提示怎么不显示内容？

爱学习的红佑提问于 2026-03-16 19:34:20 阅读 38

组件

我用iView的Poptip组件，写了个按钮想弹出提示，但点击后气泡是空的，内容没渲染出来。明明写了slot=”content”，是不是哪里写错了？

<i-button>
  <Poptip trigger="click">
    点我
    <div slot="content">这是提示内容</div>
  </Poptip>
</i-button>

我来解答赞 15 收藏

反馈

1 条解答

Dev · 国凤 Lv1

问题出在Poptip的触发元素没有正确放置。

你的代码里把"点我"直接放在了Poptip标签里面当作文本节点，但Poptip需要把触发元素作为它的默认slot内容。改一下位置就行：



  点我

  这是提示内容

或者如果你不想用i-button，就用普通的div或span：



  点我

  这是提示内容

总之"点我"这部分不要放在content slot里，要作为Poptip的默认slot（也就是trigger部分）。Poptip会自动把第一个子元素识别为触发区域。

另外注意外层的标签其实没必要，反而可能影响事件冒泡，去掉会更干净。

2026-03-17 05:00