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


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM