用到的插件如下：
"react-redux": "^5.0.6",//redux
"redux": "^3.7.2",//redux
"redux-logger": "^3.0.6",//redux 日志
"redux-thunk": "^2.2.0",//支持異步請(qǐng)求發(fā)送
"redux-devtools": "^3.4.0"http://支持redux開發(fā)工具的Chrome插件
1.分別 npm install --save 插件名
2.新建Root文件宿稀，引入store文件，通過store掰茶，向APP中注入
import {Provider}from 'react-redux';
// 引入store文件顷链，下步會(huì)創(chuàng)建
import configureStore from './store/ConfigureStore';
const store = configureStore();
import App from './App';
if (!__DEV__) {
global.console = {
info: () => {
},
log: () => {
},
warn: () => {
},
error: () => {
},
};
}
export default class Root extends Component {
constructor(props){
super(props);
this.state = {
}
}
render() {
return (
<Provider store={store}>
<App />
</Provider>
);
}
};
在App.js中引入connect
import {connect} from 'react-redux';
關(guān)聯(lián)Navigation
export const MyApp = StackNavigator({
ReactNavigation:{screen:ReactNavigation,navigationOptions:{header:null}},
Main: {
screen: MainScreen,
path:'kingdom/:DeepLinkUser'
},
Main1: {
screen: MainScreen1,
path:'kingdom/:DeepLinkUser'
},
Main2: {
screen: MainScreen2,
path:'kingdom/:DeepLinkMain2'
},
Main3: {
screen: MainScreen3,
path:'kingdom/:DeepLinkMain2'
},
profile:{
screen: ProfileScreen,
}
},
{
initialRouteName:'ReactNavigation',
initialRouteParams :{
AppName:'KingdomYrt'
},
headerMode:'screen',
transitionConfig: (() => ({
screenInterpolator: CardStackStyleInterpolator.forHorizontal,
}))
});
//設(shè)置 URL's Schema,和 Host,這里注意箭頭后面不要用“{}” 語法不識(shí)別。
const MainApp = () => <MyApp uriPrefix={'kingdomYrt://kingdomYrt/'} onNavigationStateChange={(prevNav, newNav, action) => {
console.group('Navigation Dispatchssss: ');
console.log('Action: ', action);
console.log('New State: ', newNav);
console.log('Last State: ', prevNav);
console.groupEnd();
nav.routes = newNav.routes;
}}/>
const AppWithNavigationState = ({ dispatch, nav }) => (
<MainApp navigation={addNavigationHelpers({ dispatch, state: nav })}/>
);
const mapStateToProps = state => ({
nav: state.nav,
});
export default connect(mapStateToProps)(AppWithNavigationState);
到此為止焚刚，基礎(chǔ)組件引入已經(jīng)完成
下一節(jié)我們將要講述如何使用redux点弯。
