img标签的src属性动态绑定图片

实现方法

html代码：

	<img :src="_img1" alt="" class="imgs">
	<img :src="_img2" alt="" class="imgs">

js代码：

computed: {
    
    
    // 1、网络图片，或后端返回的图片
    _img1() {
    
    
      let arr = `https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fedpic%2F4c%2Fa6%2F31%2F4ca631a8841304be2351295d50cf801d.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1623403810&t=ea28c65e7e60f68cd00d164cc70d3ceb`
      return arr
    },

    // 2、本地图片
    _img2() {
    
    
    	// 
      return require('../../assets/美女1.jpg')
    },

},

注意：
1、src 属性要加冒号 :src，表示动态的属性；
2、require方法里面只能是字符串，不能是变量；否则会报错，报错原因是找不到图片；如果是本地的图片，要使用require方法才行

拓展

1、如果想v-for多个图片，定义个数组即可

js:

data() {
    
    
    return {
    
    
      imgList:[require('../../assets/美女1.jpg'), require('../../assets/美女2.jpg'), require('../../assets/美女3.jpg')],
    }
  },

html:

<img :src="item" v-for="item in imgList" alt="" class="imgs">