React-Native集成dva.js

dvajs作为一个基于redux的状态管理框架，在react中的表现还是很不错的，如果我们想要在react-native应用中使用dvajs该怎么做呢？

首先安装dva-core和react-redux：

npm i -S dva-core react-redux

dva-core是dvajs的核心部分，能够很好的和其他react-native组件在一起工作。

dva-core和dva在提供的方法上有一些区别，不过在使用思路上是完全一样的。由于基本没有什么难点，这里就直接贴代码了。

以下是一个react-navigation3.x结合dva-core的一个配置实例：

import * as React from 'react';

import {

  createAppContainer,

  createBottomTabNavigator,

} from 'react-navigation';

import Index from './Index';

import Home from './pages/Home';

import Cart from './pages/Cart';

import { Provider } from 'react-redux';

import { create } from 'dva-core';

const indexModel = {

  namespace: 'index',

  state: { count: 1 },

  effects: {},

  reducers: {

    edit(state, { count }) {

      state.count += count;

      return { ...state };

    },

  },

};

const models = [indexModel];

const app = create(); // 创建dva实例，可传递配置参数。https://dvajs.com/api/#app-dva-opts

models.forEach((o) => { // 装载models对象

  app.model(o);

});

app.start(); // 实例初始化

const store = app._store; // 获取redux的store对象供react-redux使用

const appNavigator = createBottomTabNavigator({

  Index,

  Home,

  Cart,

});

const App = createAppContainer(appNavigator);

export default class Container extends React.Component {

  public render() {

    return (

      <Provider store={store}>

        <App/>

      </Provider>

    );

  }

}

本文代码:https://github.com/axel10/react-native-dva-typescript-template