小编典典
在您的服务器中ArticleCard,您必须创建一个Link将路由到您的完整主机Article。这个环节将包括id你试图渲染的文章(前。articles/${article._id})
通过Route将组件的路径编写Article为articles/:id,这将使我们能够捕获渲染id时的Article内容(可通过访问this.props.match.params.id)
然后,假设id用于从一些其他的API获取的文章,一个好地方调用这将是componentDidMount你的Article组件。
这是一个小示例,可能会对您有所帮助:
import React from 'react'
import {
BrowserRouter as Router,
Route,
Link,
Switch
} from 'react-router-dom'
const ParamsExample = () => (
)
const article = {
_id: 1,
title: 'First Article'
};
const ArticleList = () => (
);
const ArticleCard = ({ article }) => (
{article.title}
SEE MORE
);
class Article extends React.Component {
componentDidMount() {
console.log('Fetch API here: ', this.props.match.params.id);
}
render() {
return (
{`Fetching...${this.props.match.params.id}`}
);
}
}
export default ParamsExample
2020-07-22