如何使用React在不同组件之间保持状态

时间:2018-05-23 12:56:56

标签: javascript reactjs react-native react-router

我有三个组件并在它们之间导航我正在使用反应路线。

import React from "react";
import {HashRouter, Route, Switch, Redirect} from 'react-router-dom';
import Main from './components/main/main.component';
import SecondView from './components/secondview/secondview.component';
import ThirdView from './components/thirdview/thirdview.component';
import Traineeship from './components/traineeship/traineeships.component';
import InformationFilter from "./components/information/information-filter.component";
import InformationJob from "./components/information/information-job.component";

const AppRoutes = () => (
    <HashRouter>
        <Switch>
            <Route path='/information-filter' component={InformationFilter}/>
            <Route path='/information-job' component={InformationJob}/>
            <Route path='/traineeships' component={Traineeship}/>
        </Switch>
    </HashRouter>

);

export default AppRoutes;

在InformationFilter组件中,我使用Link导航到另一个组件:

<Link to={{
       pathname: '/information-job',
       state: {industry: this.state.selectedIndustry, job: this.state.selectedJob}
}}>

我可以看到InformationJob和Information Job I中可用的参数使用Link to Traineeship同时传递,但问题是当我从Traineeship回到InformationJob中的这一部分时:

componentDidMount() {
        console.log(this.props.location.state);
    }

是空的,最好的方法是什么,以便我可以将参数从组件A传递到B然后再传递给C,这样点击后退按钮时就不会有任何问题。

对此有何想法?

0 个答案:

没有答案