vue element-ui el-tooltip组件失效问题

引用自:
https://blog.csdn.net/ygrhlh/article/details/121660806

vue element-ui el-tooltip组件失效问题

因为公司项目年代久远以及谷歌chrome 80 后的samesite问题，所以在开发阶段使用Firefox来查看效果

项目上到测试环境之后，我这边使用Firefox查看效果是没有问题的，tooltip组件正式显示

但是当测试使用Chrome的时候，tooltip组件没有显示，审查元素也发现没有相应的tooltip的html元素出现，正常来讲应该是要出现类似以下的html元素的

最后经过大量百度(bushi) 以及查阅github的issue之后得出：

当el-tooltip组件内直接放置文本或者单一元素的时候，在Chrome会有tooltip不出现的问题，在Firefox却不会

直接放置文本

<!-- 单一元素 -->
<el-tooltip class="item" effect="dark" content="tooptip" placement="top-start">
 	<textarea v-model="value" @change="updata"></textarea>
</el-tooltip>

1 2 3 4 5 6 7 8 9 10 11 尝试解决 但是如果你用一个盒子去包裹的话，它又可以了！！！

用一个p标签包裹文本

<el-tooltip class="item" effect="dark" content="tooptip" placement="top-start">
 	<div>
 		<textarea v-model="value" @change="updata"></textarea>
	</div>
</el-tooltip>

1 2 3 4 5 6 7 8 9 10 11 总结 在使用el-tooptip组件时应该始终用一个盒子去包裹住里面的元素

以上
如有错误，请不吝赐教
————————————————
版权声明：本文为CSDN博主「ygrhlh」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/ygrhlh/article/details/121660806