实现动态绑定不同的图片,通过import多个图片,并绑定
样式:
<img :src="imgUrl" style="height: 60px" alt/> <!--imgurl变量绑定不同的图片-->
引入不同图片:
import pic1 '../../pics/pic1.png';
import pic2 '../../pics/pic2.png';
import pic3 '../../pics/pic3.png';
...
data() {
imgUrl: "" //声明imgurl变量绑定不同图片
}
方法中改变imgUrl变量从而实现显示不同的图片
changePics() {
...
this.imgUrl = pic1; //显示图片1
...
this.imgUrl = pic2; //显示图片2
...
this.imgUrl = pic3; //显示图片3
}