gpt4 book ai didi

javascript - 要求(img 路径)不工作/找不到模块 "."reactjs

转载 作者:行者123 更新时间:2023-11-29 15:19:17 25 4
gpt4 key购买 nike

您好,我正在尝试使用 react.js 将一组图像从 this.state 映射到图像标签。我遇到了错误:“找不到模块‘.’”

这里是错误: 错误:找不到模块“。” webpackMissingModule 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')
]
...

关于javascript - 要求(img 路径)不工作/找不到模块 "."reactjs,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45737137/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com