我一直在想如何通过React和Webpack动态添加图像.我有一个src/images以下的图像文件夹和一个src/components/index以下的组件.我正在使用url加载器和以下Web包配置
{
test: /\.(png|jpg|)$/,
loader: 'url-loader?limit=200000'
}
在组件中，我知道在创建组件之前，我可以为文件顶部的特定图像添加require(image_path)，但我希望使组件通用，并使其具有从父组件传递的图像路径的属性.
我try 过的是:
<img src={require(this.props.img)} />
对于实际属性，我try 了几乎所有我能想到的从项目根、react应用根和组件本身到图像的路径.
文件系统
|-- src
| ` app.js
| `--images
| ` image.jpg
| ` image.jpg
| `-- components
| `parent_component.js
| `child_component.js
父容器基本上是子容器的倍数...
<ChildComponent img=data.img1 />
<ChildComponent img=data.img2 />
etc....
使用react和webpack with url loader有什么方法可以做到这一点，还是我只是走错了路？