vue中的图片引入、动态绑定样式

1. 图片引入的二种方式

注：require模块的本质是对象，输入时必须找到对象的属性

//第一种 需要在data中写上
import png from "../assets/test.png";

//第二种
data(){
  return {
   png1:require("../assets/test.png");
}
或//不在return中
  pngs:[
     png1:require("../assets/test.png");
]
}

2.动态绑定样式

  :style ="对象&{data中的}    、  [对象1，对象2] "

  :class='[class1,class2]' 其中class是data中的变量class1:"style1"

   注：其中的对象指属性

动态绑定样式

<div :class="[isActive ？class1 ：class11  , class2]"></div>
//根据某个条件切换样式用三元表达式
//[ , ] 逗号隔开样式

//动态切换
<div :class="{class1:isActive,  class2:isActive}"></div>

注：isActive 也可以是computed来的。

3 scoped

父元素的样式会渗透到子元素，那么子元素在包一层便可解决问题