gpt4 book ai didi

reactjs - 在react.js中刷新页面后,某些文件(js、css、图像)未加载

转载 作者:行者123 更新时间:2023-12-02 11:09:08 28 4
gpt4 key购买 nike

我有问题,我正在使用 react 路由器通过单击链接“更多”来访问完整信息新闻页面,所有内容都显示和渲染良好,直到我更改这两个页面中的某些内容。

FullInfoNews.js

export  class FullInfoNews extends React.Component {
render (){
return (
<div>
<div className="row">
<div className="about-title">
<div className="container">
<h2>{this.props.news.body}</h2>
<p>{this.props.news.title} </p>
<img className="center-block" src={this.props.news.image} />
</div>
</div>
</div>
</div>
);
}
}

FullInfoNewsContainer.js

export default class FullInfoMediaContainer extends React.Component{
constructor(){
super();
this.state={
news:[]
}
}

componentDidMount(){
console.log('componentDidMount777');

const url='http://new-sciencepark.1gb.ru/api/getNewsById/'+this.props.params.id+'?lang=Ru' ;
superagent
.get(url)
.query(null)
.set('Accept', 'application/json')
.end ((error, response)=>{
const news=response.body.data.news
console.log(JSON.stringify(news));
this.setState({
news: news
})
})
}


render(){
console.log(this.props)
const {params}=this.props;
return(
<div>
{params.id}
<FullInfoNews news={this.state.news} />
</div>

);
}

}

enter image description here

enter image description here问题是所有文件都未加载并显示 404(未找到)错误。为什么我不明白?也许是 DOM 的问题?

index.html

  <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Technopark site</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css" />
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css" />
<link rel="stylesheet" href="app/style.css">
<script src="https://maps.googleapis.com/maps/api/js?libraries=visualization&key=AIzaSyD1USlQFgU5SK9iHulGnQwUEP7sB-d4Cew"></script>
<script src="app/js/jquery-2.1.3.min.js"></script>

</head>
<body>
<div id="app"></div>
<script src="/app/bundle.js"></script>
</body>
</html>

最佳答案

通过 React Router 组件导航到 URL 与直接在浏览器中输入 URL 不同(这本质上是刷新页面时发生的情况)。

也就是说,如果您在端口 5000 上启动应用程序,打开浏览器并转到 localhost:5000,然后单击将“/page1”推送到浏览器历史记录的按钮,这样您最终会在 localhost:5000/page1 处,这与打开浏览器、在 URL 栏中输入 localhost:5000/page1 并按回车键。这是客户端路由与服务器端路由。

你能给我们看看你的index.html吗?

关于reactjs - 在react.js中刷新页面后,某些文件(js、css、图像)未加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42201031/

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