Javascript React应用程序不显示本地导入的图像
我正在尝试做一个石头剪刀游戏,我们可以玩电脑,我有一个div,显示用户的选择和电脑的选择,但只有用户的图像显示,电脑的图像只显示alt文本。用户和电脑选择的图像都存储在本地。 我正在使用网页制作 附录js:-Javascript React应用程序不显示本地导入的图像,javascript,reactjs,webpack,Javascript,Reactjs,Webpack,我正在尝试做一个石头剪刀游戏,我们可以玩电脑,我有一个div,显示用户的选择和电脑的选择,但只有用户的图像显示,电脑的图像只显示alt文本。用户和电脑选择的图像都存储在本地。 我正在使用网页制作 附录js:- import React,{Component} from "react" //import {BrowserRouter} from "react-router-dom" import Navbar from "./components/Navbar" import Scoreboard
import React,{Component} from "react"
//import {BrowserRouter} from "react-router-dom"
import Navbar from "./components/Navbar"
import Scoreboard from "./components/ScoreBoard"
import Result from "./components/Result"
class App extends Component{
render(){
return(
<div className="app">
<Navbar />
<Scoreboard />
<Result />
</div>
)
}
}
export default App
import React,{Component}来自“React”
//从“react router dom”导入{BrowserRouter}
从“/components/Navbar”导入导航栏
从“/components/Scoreboard”导入记分板
从“/components/Result”导入结果
类应用程序扩展组件{
render(){
返回(
)
}
}
导出默认应用程序
结果:
import React from "react"
import Paper from "./images/paper.png"
import Scissor from "./images/scissors.png"
import Rock from "./images/rock.png"
class Result extends React.Component{
state={
result_message:"WELCOME",
user_result_image:Paper,
comp_result_image:Rock,
}
render(){
return(
<div className="result">
<div className="elem1" id="user">
<p>User</p>
<img src={this.state.user_result_image} alt="resultimage" id="user-img"/>
</div>
<div className="elem1" id="welcome"><p id="user-result-image">{this.state.result_message}</p></div>
<div className="elem1" id="computer">
<p>Computer</p>
<img scr={this.state.comp_result_image} alt="compimage" id="comp-img"/>
</div>
</div>
)
}
}
export default Result
从“React”导入React
从“/images/Paper.png”导入纸张
从“/images/Scissor.png”导入剪刀
从“/images/Rock.png”导入岩石
类结果扩展了React.Component{
陈述={
结果信息:“欢迎”,
用户\u结果\u图像:纸张,
合成结果图像:岩石,
}
render(){
返回(
使用者
{this.state.result\u message}
计算机
)
}
}
导出默认结果
找到了,你只是打错了
<img src={this.state.comp_result_image} alt="compimage" id="comp-img"/>
</div>
将scr
更改为src