v-html里面添加样式
项目中,使用V-html渲染的页面,要添加样式,改如何做
解决方案1:在updated生命周期函数中,js动态配置样式,代码如下:
1 updated() { 2 $('.msgHtmlBox').find('p').css('color', 'blue'); 3 },
解决方案2:去掉style标签中的scoped属性(我用的这种)
scoped属性导致css仅对当前组件生效(用css3的属性选择器+生成的随机属性实现的),而html绑定渲染出的内容可以理解为是子组件的内容,子组件不会被加上对应的属性,所以不会应用css.
解决方案3:写样式的时候添加>>> (这种打包的时候会报错)
1 <style scoped> 2 .msgHtmlBox >>> p{ 3 color: blue; 4 } 5 </style>