通常我会使用axios发送GET请求,但在“React Practice Course”教程中,讲师成功点击这条路线
app.get('/api/admin/download/:filename', auth, admin, (req, res) => {
console.log('here I am ', req.params.filename);
const file = path.resolve('.')+`/uploads/${req.params.filename}`;
res.download(file);
})
使用此代码中的链接
import {Link} from 'react-router-dom';
showFiles = () => (
this.state.files &&
this.state.files.map((filename,i) => (
<li key={i}>
<Link to={`/api/admin/download/${filename}`}
target="_blank">
{filename}
</Link>
</li>
))
)
如here所示,该链接与服务器中的路径匹配,但反应路由器正在将我发送到PageNotFound组件,并且从不发送GET请求。
为了使链接文件到达服务器,我缺少什么?我怀疑问题出在我的路线文件中。
const Routes = () => {
// null = public route
return (
<Layout>
<Switch>
<Route path="/admin/add_product" exact component={Auth(AddProduct, true)} />
<Route path="/admin/manage_categories" exact component={Auth(ManageCategories, true)} />
<Route path="/admin/manage_site" exact component={Auth(ManageSite, true)} />
<Route path="/admin/add_file" exact component={Auth(AddFile, true)} />
<Route path="/user/cart" exact component={Auth(Cart, true)} />
<Route path="/user/dashboard" exact component={Auth(Dashboard, true)} />
<Route path="/user/user_profile" exact component={Auth(UpdateProfile, true)} />
<Route path="/register_login" exact component={Auth(RegisterLogin, false)} />
<Route path="/register" exact component={Auth(Register, false)} />
<Route path="/product/:id" exact component={Auth(Product, null)} />
<Route path="/shop" exact component={Auth(Shop, null)} />
<Route path="/" exact component={Auth(Home, null)} />
<Route component={Auth(PageNotFound)} />
</Switch>
</Layout>
)
}
为了扩展我的评论,我在这里回答。
以下适用于我:
import React from "react";
import { render } from "react-dom";
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
const About = () => <div>About</div>
const Home = () => <div>Home</div>
const Topics = () => <div>Topics</div>
const apiUrl = "http://localhost:9000/api";
const BasicExample = () => (
<Router>
<div>
<ul>
<li>
<Link to="/">Home</Link>
</li>
<li>
<Link to="/about">About</Link>
</li>
<li>
<Link to="/topics">Topics</Link>
</li>
<li>
<a href={`${apiUrl}/v1/test`}>Api GET request</a>
</li>
</ul>
<hr />
<Route exact path="/" component={Home} />
<Route path="/about" component={About} />
<Route path="/topics" component={Topics} />
</div>
</Router>
);
render(<BasicExample />, document.getElementById("root"));
所以基本上我只是创建了一个<a>
通过正确的href
网址,它没有落入<Router>
,如下所示:https://github.com/ReactTraining/react-router/issues/1147#issuecomment-113180174
你确定你将正确的网址传递给了主播的href吗?