01-背景图/img/json中图片路径引入方式和json中有标签
这里所说的方式指的是在webpack中指定了相对路径了,如@ 代表src
(1)在css中background:url(' ~@/xx/xx/xx.png');
(2)在img前景图方式的引入:img src="@/xx/xx/xx.png"
(3)引入外部json,json中有图片路径:
{
name:'zs',
src:require('@/xx/xx/xx.png')
}
在当前组件中如果引入的json对象中有标签,我们需要用v-html=""渲染,那么在vue组件中如何给到样式?
-通常我们都是直接设置如div下面的span标签(这个就是json中的标签),发现是不起作用的,为什么?
-因为在当前组件中style中加入scoped,这个单词加在当前组件中,是只对当前组件中的标签设置的样式生效,而我们外部引入的不起作用。
scoped属性导致css仅对当前组件生效(用css3的属性选择器+生成的随机属性实现的),而html绑定渲染出的内容可以理解为是子组件的内容,子组件不会被加上对应的属性,所以不会应用css