vue动态渲染img,图片不显示

问题:可以确认图片路径没有问题,使用img标签单独渲染其中一张可以显示,循环渲染就不显示了

  1. 数据
    vue动态渲染img,图片不显示_第1张图片

  2. 结构
    结构

  3. 页面
    vue动态渲染img,图片不显示_第2张图片

解决:把图片路径用require()调用,这样就可以正常显示了

vue动态渲染img,图片不显示_第3张图片
在这里插入图片描述

原因:

在动态加载图片时webpack会把图片来当做模块来用,所以url-loader将无法解析图片地址,然后npm run dev 或者 npm run build之后导致路径没有被加工

你可能感兴趣的:(img,html,vue.js,前端)