最近用element-ui实现图片展示时，发先本地的图片加载不了，一开始是这么写的
<el-imageclass="table-td-thumb":src="'../../assets/img/coca.jpg"></el-image>
目录结构如下
本地加载
结果发现不对，加载不出来，一查资料，原来本地的图片要用require加载，遂改成下面代码
<el-imageclass="table-td-thumb":src="'require(../../assets/img/coca.jpg)'"></el-image>
果然加载成功了
动态加载
但是我是要动态加载，因此选择将图片路径放在数据库中，数据库加载数据到变量中，最后在组件中调用
<template slot-scope="scope"><el-imageclass="table-td-thumb":src="require(scope.row.img)"></el-image></template>
结果却出错了，图片加载不出来，于是又查了很多资料，原来require中不能直接用变量，这可难办了，接下来又查了很多资料，发现原来这么写就行了。
<template slot-scope="scope"><el-imageclass="table-td-thumb":src="require('../../assets/img/'+scope.row.img+'.jpg')"></el-image></template>
将文件名作为变量前后拼接字符串，而不是直接用变量做require的参数，这样就没问题了。
查看大图
成功后我还想要用preview-src-list实现查看大图效果，直接像上面写又错了，后来发现是要再加个方括号，如下
<template slot-scope="scope"><el-imageclass="table-td-thumb":src="require('../../assets/img/'+scope.row.img+'.jpg')":preview-src-list="[require('../../assets/img/'+scope.row.img+'.jpg')]"></el-image></template>
