我的应用程序中有这样的错误
1 of 6 errors on the page
Error: Cannot find module '../images/Kingsglaive_Final_Fantasy_XV.jpg'
所以我认为问题在于我像这样忘记了文件中的另外两个点:
'../../images/Kingsglaive_Final_Fantasy_XV.jpg'
因为我的文件结构是这样的:
现在,我想编辑我的简化器,因为该代码位于MovieList-reducer.js中。只需在imgUrl中放置两个点:
const reducer = () => {
return (
[
{
"id": 100,
"title": "Kingsglaive",
"subtitle": "Final Fantasy XV",
"description": "King Regis, who oversees the land of Lucis, commands his army of soldiers to protect the kingdom from the Niflheim empire's plans to steal the sacred crystal.",
"year": 2016,
"imageUrl": "../../images/Kingsglaive_Final_Fantasy_XV.jpg",
"rating": 4.5
},
{
"id": 200,
"title": "Final Fantasy",
"subtitle": "Spirits Within",
"description": "A scientist makes a last stand on Earth with the help of a ragtag team of soldiers against an invasion of alien phantoms.",
"year": 2001,
"imageUrl": "../../images/Final_Fantasy_Spirits_Within.jpg",
"rating": 4.5
},
{
"id": 300,
"title": "Ghost In The Shell",
"subtitle": "Ghost In The Shell",
"description": "A hacker known as the Puppet Master is hunted by a female cyborg cop and her partner. This film is a revised version of Ghost in the Shell (1995).",
"year": 2008,
"imageUrl": "../../images/Ghost_In_The_Shell_2_0.jpg",
"rating": 5
},
{
"id": 400,
"title": "Appleseed Alpha",
"subtitle": "Appleseed Alpha",
"description": "A young female soldier Deunan and her cyborg partner Briareos survive through the post World War 3 apocalyptic New York in search of human's future hope, the legendary city of Olympus.",
"year": 2014,
"imageUrl": "../../images/Appleseed_Alpha.jpg",
"rating": 3.8
},
{
"id": 500,
"title": "Resident Evil",
"subtitle": "Vendetta",
"description": "Chris Redfield enlists the help of Leon S. Kennedy and Rebecca Chambers to stop a death merchant, with a vengeance, from spreading a deadly virus in New York.",
"year": 2014,
"imageUrl": "../../images/Resident_Evil_Vendetta.jpg",
"rating": 4.2
}
]
)
}
export default reducer;
但是当我编辑MovieList-reducer.js时,什么也没有发生,并且错误仍然存在。我还像添加标题一样编辑标题:“ Kingsglaive12321”,但它并没有反映在redux状态上。
我尝试查看redux devtools,但那里没有错。只是即使编辑了文件,我的编辑也没有改变。
我还尝试删除reducers文件,由于在刷新浏览器后redux存储中仍然存在状态,我感到震惊
为什么不更改?
编辑:
这是我在MovieCards.js中放的内容
import React from 'react';
const MovieCard = (props) => {
return (
<div>
<img src={require(props.movie.imageUrl)} alt="" />
<h4>{props.movie.title}</h4>
<h6>{props.movie.subtitle}</h6>
</div>
)
}
export default MovieCard
并在终端发出警告:严重依赖项:依赖项的请求是表达式