我如何访问由reactjs中的应用程序创建的路由

问题描述


在这里,我通过服务器端的api获取新闻,然后为该特定新闻项创建路由。当用户单击新闻项之一时,将创建路线,并且用户重定向到创建的路线,但是在浏览器中前进和后退时存在导航问题。
我知道我应该创建一个文件获取route的参数,并再次调用该特定新闻的api,但是我不知道该如何帮助我。
这是News.js中嵌套路由的代码
return (
<Router>
  <Switch>
    <Route
      path={match.path}
      exact
    >
      <NewsList />
    </Route>
    <Route
      path={`${match.path}/:topicId`}
    >
      <NewsFullContent />
    </Route>
  </Switch>
</Router>
    );

,这是NewsFullContent(呈现新闻的文件)的代码

import React,{ useEffect } from 'react';
import styled from 'styled-components';
import BackButton from '../../../components/BackButton';
import { withRouter,useParams } from 'react-router-dom';
import apis from '../../../app/apis';
import cts from '../../../app/cts';

const NewsTitle = styled.h1`
  font-size: 14pt;
`;

const NewsDate = styled.h3`
  font-size: 10pt;
  color: #aaa;
`;

const NewsContent = styled.div`

`;

const NewsType = styled.h4`
  font-size: 8pt;
  color: #ddd;
`;

const NewsFullContent = ({ location }) => {
  
  const {
    title,content,type,date
  } = location.state;

  return (
    <div>
      <BackButton />
      <NewsTitle>{title}</NewsTitle>
      <NewsDate>{date}</NewsDate>
      <NewsContent
        dangerouslySetInnerHTML={{ __html: content }}
      >
      </NewsContent>
      <NewsType>type: {type}</NewsType>
    </div>
  );
};

export default withRouter(NewsFullContent);

,结果如下:

enter image description here

解决方法

@mqtt.on_connect() def handle_connect(client,userdata,flags,rc): mqtt.subscribe('home/mytopic') 组件中,您可以使用BackButton

useHistory