RN精进笔记（八）react-native-router-flux研究

react-native-router-flux研究总结

框架集成步骤

1. 配置package.json依赖

    "react": "^0.14.7",
    "react-native": "0.22.2",
    "react-native-button": "^1.2.1",
    "react-native-drawer": "^1.16.7",
    "react-native-modalbox": "^1.3.0",
    "react-native-router-flux": "file:../"
   #此处react-native-route-flux框架可以通过npm info查看
   

2. 配置index.js文件中的Scene，注册可以跳转的页面

   #定义reducers
   const reducerCreate = params => {
     const defaultReducer = Reducer(params);
     return (state, action) => {
       console.log("ACTIONS:" ,action);
       return defaultReducer(state, action);
     }
   }
   
   #注册好所有可以跳转的页面和跳转用来传参的key值
   class MyExample extends React.Component {
     constructor(props) {
       super(props)
     }
     render() {
       return 
         
           
               
               
           
         
       
     }
   }
   
   #此处的key=login对于下面很有用处
   

3. 首页和其他供跳转的页面的写法

   class Launch extends React.Component {
     constructor(props) {
       super(props)
     }
     render() {
       return (
         
           这是首页！
           Actions.login({data:"Custom data", title:"Custom title" })}>Go to Login page
         
       )
     }
   }
   
   #根据步骤二中的key=login来传递参数！！！