脚本宝典收集整理的这篇文章主要介绍了

vue render函数中渲染伪类元素和style中scoped的问题?

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

使用vue的render生成一个table 需求如下:根据文件类型加载不同的图标

clipboard.png

于是我用css伪类写了几种带折角的图标,起始样式一样,就是颜色和中间文字不一样:

clipboard.png

效果图如下

clipboard.png

然后使用render函数生成表格:

clipboard.png

其实就是根据文件类型不同,加载我写好的class

为了测试我还在table下方单独写了几个div看看效果:

clipboard.png

结果,坑来了。。。。。。。。。。。。。。。。

clipboard.png

下面的静态div一切正常,表格里面的render的没效果?坑我啊?

看一下页面的dom,class已经生成了啊

clipboard.png

对比一下有效果的div

clipboard.png

好像没什么区别,在仔细看看卧槽。。发现问题了。。。。。。。

这是什么鬼

clipboard.png

原来是style scoped生成了css模块化,去掉scoped一切ok

clipboard.png

希望对大家有用

clipboard.png

总结

以上是脚本宝典为你收集整理的

vue render函数中渲染伪类元素和style中scoped的问题?

全部内容,希望文章能够帮你解决

vue render函数中渲染伪类元素和style中scoped的问题?

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过