其他分享
首页 > 其他分享> > 路由布局 react-mobile

路由布局 react-mobile

作者:互联网

一级路由:container: {

login, //

register,

main

}

 

配置antdesign

引入redux

npm i --save react-redux redux-thunk

首先创建reducer.js  store.js actions.js action-types.js

//在reducer.js里面创建函数,使用combineReducer合并reducer,变成一个对象对外暴露

import  {combineReducer} from 'redux'

function xxx(state=0,action){

  return state

}

function yyy(state=0,action){

  return state

}

export default combineReducer({xxx,yyy})

//在store里面创建对象

import {createStore,applyMiddleWare} from 'redux'

import reducer from './reducer.js'

import thunk from 'redux-thunk'

export default createStore(reducer,applyMiddleWare(thunk))

 

//在入口js引入组件  App.js中

import {Provider} from 'react-redux'

  import store from './redux/store' render() { return ( <Provider store = {store}> <HashRouter> <Switch> <Route path="/login" component={Login}></Route> <Route path="/register" component={Register}></Route> <Route path="/" component={Main}></Route>{/* 默认组件,前面没有一个匹配就会找Main组件 */} </Switch> </HashRouter> </Provider> ) }

 

标签:mobile,reducer,js,react,thunk,state,import,redux,路由
来源: https://www.cnblogs.com/lucy-xyy/p/12525846.html