我收到这样的错误,找不到模块“ ./assets/photo.jpg”。这是app.js中的代码
import ReactDOM from 'react-dom';
import './App.css';
import Intro from './components/Introduction'
function App() {
return (
<div className="outerwrapper">
<div className="wrapper2">
<Intro content={{ image : "./assets/photo.jpg",
name : "Hello",
text : "An undergraduate electrical and electronic engineering student"
}} />
</div>
</div>
Introduction.js组件中的代码。我可以通过将图像的位置输入到require函数中来导入图像。如果没有require函数,也不会加载图像。
import React from 'react';
function Intro(props) {
return (
<div className="Intro">
<img src={require(props.content.image)}/>
<h1>{props.content.name}</h1>
<p>{props.content.text}</p>
</div>
)
}
export default Intro;
尝试将图像导入为组件(正确的方式,需要图像-不良做法)
App.js
import Photo from './assets/photo.jpg'
...
<Intro content={{
image : Photo, // pass Photo as prop
name : "Hello",
text : "An undergraduate electrical and electronic engineering student"
}} />
Intro.js
...
<img src={props.content.image}/>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句