路由布局 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>
)
}