您好,我正在尝试使用react.js 将一组图像从 this.state 映射到图像标签。我遇到错误:“找不到模块'。'”
这是错误:
错误:找不到模块“。”
webpack缺少模块
src/components/thumbnails.js:26
23 | }
24 | render(){
25 | const thumbnailimg = this.state.thumbnail_vids.map((img,i)=>{
> 26 | let image = require(img);
27 | return(<img key={i} className="thumbimg" src={image}/>)
28 | })
29 | return(
这是完整的代码:thumbnails.js
import React, { Component } from "react";
import { render } from "react-dom";
class Thumbnails extends Component {
constructor(props){
super(props);
this.state = {
thumbnail_vids: ['../thumbnails/asthma_1.jpeg','../thumbnails/asthma_2.jpeg','../thumbnails/asthma_3.jpeg']
}
}
render(){
const thumbnailimg = this.state.thumbnail_vids.map((img,i)=>{
let image = require(img);
return(<img key={i} className="thumbimg" src={image}/>)
})
return(
<div>
<span className="thumbtable">
<img src={require("../thumbnails/asthma_1.jpeg")} />
{thumbnailimg}
</span>
</div>
)
}
}
export default Thumbnails;
这是我的 src 文件夹的项目结构(尽管我已经抽象了与当前问题无关的任何内容):
├── App.css
├── App.js
├── App.test.js
├── components
│ ├── header.js
│ ├── likebutton.js
│ ├── thumbnails.js
│ └── topicselect.js
├── index.css
├── index.js
├── registerServiceWorker.js
├── thumbnails
│ ├── asthma_1.jpeg
│ ├── asthma_2.jpeg
│ ├── asthma_3.jpeg
│ ├── copd_1.jpeg
│ ├── copd_2.jpeg
│ ├── copd_3.jpeg
│ ├── diabetes_1.jpeg
│ ├── diabetes_2.jpeg
│ ├── diabetes_3.jpeg
│ ├── emphysema_1.jpeg
│ ├── emphysema_2.jpeg
│ ├── emphysema_3.jpeg
│ ├── hyperlipidemia_1.jpeg
│ ├── hyperlipidemia_2.jpeg
│ ├── hyperlipidemia_3.jpeg
│ ├── hypertension_1.jpeg
│ ├── hypertension_2.jpeg
│ ├── hypertension_3.jpeg
│ ├── narcolepsy_1.jpeg
│ ├── narcolepsy_2.jpeg
│ ├── narcolepsy_3.jpeg
│ ├── pneumonia_1.jpeg
│ ├── pneumonia_2.jpeg
│ └── pneumonia_3.jpeg
我正在使用 create-react-app
尝试移动require向您所在州声明如下:
this.state = {
thumbnail_vids: [
require('../thumbnails/asthma_1.jpeg')
]
...
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)