iView的Tooltip在动态内容更新后不显示新文字怎么办?

博主园园 阅读 17

我在用iView的Tooltip组件时,发现当绑定的提示文字是动态数据(比如从接口返回的)时,Tooltip第一次能正常显示,但数据更新后,鼠标移上去还是显示旧的内容。明明data里的值已经变了,页面其他地方都更新了,就Tooltip没反应。

我试过加:key强制刷新,也试过this.$forceUpdate(),都不行。是不是哪里用错了?下面是我的代码:

export default {
  data() {
    return {
      tooltipContent: '加载中...'
    }
  },
  mounted() {
    setTimeout(() => {
      this.tooltipContent = '新提示内容'; // 这时候Tooltip点开还是“加载中...”
    }, 1000);
  }
}
我来解答 赞 4 收藏
二维码
手机扫码查看
1 条解答
闲人伊糖
我一般直接给 Tooltip 加个 v-if,数据变了就让它销毁重建,最省事:
<Tooltip v-if="tooltipContent" :content="tooltipContent">
<Button>悬停看提示</Button>
</Tooltip>

或者用 :key="tooltipContent" 绑定内容当 key 也行,反正只要让它觉得「这是个新组件」就对了。
点赞 1
2026-02-27 12:23