Vue3动态加载图片

vue3从数据库中获取文件路径后动态载入到页面中的方法为：

<el-table-column label="图片" width="150">
  <template #default="scope">
  <img :src="require('../assets/goodsImage/'+scope.row.image+'.jpg')" class="image" alt>
  </template>
</el-table-column>

注意：在动态加载图片时，必须使用require函数，传入图片的相对路径，并且，require函数中不能直接传入变量的值。例如，

 <img :src="require(scope.row.image)" class="image" alt>

这会导致图片加载失败！！！

必须使用字符串拼接的方法进行传参。

本文中，数据库内容如下：

vue项目目录结构为：

图片加载成功！

参考：
https://blog.csdn.net/qq_29869111/article/details/100154941