vue 图片路径 和 base64 图片

切换图片路径

问题：在项目中遇到一个问题：请求回来的列表数据，有的没有图片（url为空），需要切换为本地图片路径

解决：

1、在js或vue文件中导入需要替换的本地图片

　　

var imgUrl = require('../../assets/image/customerPromote/customer_img3.png')

或：

import imgUrl from '../../assets/image/customerPromote/customer_img3.png'

2、

 替换图片

for (let i = 0; i < list.length; i++) {
          if (list[i].actionImage == '') {
            var imgUrl = require('../../assets/image/customerPromote/customer_img3.png')
            list[i].actionImage = list[i].actionImage.replace('', imgUrl)
          }
        }

base64的优点

base64图片格式

src="data:image/png;base64,编码"

  <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAIAAACQKrqGAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAB8ElEQVR42mMQgAEhQYEgNeVua+OVzpZrnSxm2phk6qjLi4rAFTBAKDNZqT3+rvdCPO4Fu98LdL0b4HLX3/mun+NlX/t4TVWEUiNpiZMBTrdD3KFKg9zgSu/6OtzxcczUVgUrFRRMz/U97Wt/DSiNYepdH4c73vY3vGzNpSUZxOy0DKfFr/CzvejrcCPI7eGi2YdOPtp+6tXd87vvL/F/ttDi3QrzL+st93QaMUhnOCktTQmvCjroaX1v4ey6VV/8e7/69X6NnvL1+s1bv/c7/dlv9+eg7df9NgwytX4KS5LV5yf2hTnsP/MCos6n56tP99e2DV9+XC77d9Lp3ymn/6edGKQa/OQWJ8kvSfLtjNl0+rNvD1Sdd/fXsmVfft5q+X/O9f85l//nnBkkit1kFycCEVDDodMXA/uh6ry6vqw68vHP5USwOpd/Z50YRINNpBclQJDH5vq9l18XLf6SOvvzwv0fz1+YBzfy1norBkEFCcm5UZIL4yBIZ0VO6aG5jUeWpK4s/X3WE6Lu/zmnqmQ1UBQIh5lKLIwTXxALQzHiM6Mu7/OBqzu71ExMVAgcsYICIik24vNjxBaAkOj86KT5fv/OuUPUXVppqakiikgDoORiryna7i8yP0p4Rtj9Ax5ARW8P2HYXaUlLCkEUAAAxhAhwbbNJtAAAAABJRU5ErkJggg==" alt="">

 减少http请求