Vue动态绑定本地图片无法显示的两种解决方案

//使用import引入
import img1 from './img/img1.png'
import img2 from './img/img2.png'

export default {
  data() {
    return {
      imgList[
          {
            id: 0,
            imgUrl: img1
          },
          {
            id: 1,
            imgUrl: img2
          }
          ]
         }
       }
     }

<img v-for="item in imgList" :key="item.id" :src="imgUrl" />

getImage() {
  this.imgList.forEach(item => {
    item.imgUrl = require('./img/' + item.name + '.png')
    })
  }

data() {
    return {
      imgList[
          {
            id: 0,
            name: 'img1',
            imgUrl: ''
          },
          {
            id: 1,
            name: 'img2',
            imgUrl: ''
          }
          ]
       }
    }