react组件中引用本地图片

使用create-react-app脚手架写项目，遇到一个问题react引用本地图片。从JSON文件中，读取图片路径地址，在前端渲染。但是在ES6中不支持<img />中直接写图片路径。

1. 使用import引入

import img1 from '../assets/img/img1.jpg'   //引入
···
<img src={img1} />   //使用

2. 使用require引入

<img src={require('../assets/img/img1.jpg')} />
这种方式只能够使用路径地址不能够使用变量。

3. 加载全部图片路径

const requireContext = require.context("../assets/img",true, /^\.\/.*\.png$/);
const projectImgs = requireContext.keys().map(requireContext);
在渲染的时候遍历这个数组，如果存在这个数据，就选择渲染。