ReactJS – Reactive router code in separate files

< br /> { routes} 

I am a novice and I am trying to learn redux with router. I want to route As a separate file. But it doesn’t work because I can’t pass dependencies. Below is the code details.

Working index.js also has routing:

import React from "react";
import ReactDOM from "react-dom";
import {Provider} from'react-redux';
import {ReduxRouter} from " redux-react-router";
import {Route} from "react-router"

import createBrowserHistory from "history/lib/createBrowserHistory"
import configureStore from'./store ';

import App from "./containers/App";
import Home from "./components/Home";
import Countries from "./components/Countries" ;
import {fetchData} from'./actions/actions';

const history = new createBrowserHistory();
const store = configureStore();
< br />function loadData() {
 store.dispatch(fetchData('https://restcountries.eu/rest/v1/ all'))
}

ReactDOM.render(
 
 
 
 
 
 
 
 
 
 ,
 document.getElementById('root' )
);

The following is the code I tried to split into separate routes.js

index.js

< pre>import’babel-core/polyfill’;
import React from “react”;
import ReactDOM from “react-dom”;
import {Provider} from’react-redux’;
import {ReduxRouter} from “redux-react-router”;
import {Route} from “react-router”

import createBrowserHistory from “history/lib/createBrowserHistory”< br />import configureStore from’./store’;

import routes from “./routes”;
import {fetchData} from’./actions/actions’;

const history = new createBrow serHistory();
const store = configureStore();

ReactDOM.render(





,
document.getElementById(‘root’)
);

routes.js

import React from "react";
import {Provider} from'react-redux ';
import {ReduxRouter} from "redux-react-router";
import {Route} from "react-router"


import App from ". /../containers/App";
import Home from "./../components/Home";
import Countries from "./../components/Countries";
< br />const router =

 
 
 
 
;

export default router ;

However, because the loadData function cannot be recognized, an error is thrown.

Please help.

Pass it as a child, please note that the parent is called a router:

 { routes} 

There are no historical props for routing, routers.

Check the examples of Router.js and Route.js on my launcher: https ://github.com/DominicTobias/universal-react/tree/master/app