redux offline

维护者想要

持续的Redux商店用于推理式™离线第一应用程序，并具有对乐观UI的一流支持。与React，React Native或作为任何Web应用程序的独立状态容器一起使用。

Redux离线现在由社区驱动的团队维护。库的新版本现在将在NPM组织@redux-offline下可用。非常感谢@jevakallio首先创建了这个令人惊叹的图书馆。

快速开始

1。使用NPM安装（或纱线）

对于反应天然0.60+

npm install --save @redux-offline/redux-offline@native

用于React Native Expo SDK 36

npm install --save @redux-offline/redux-offline@expo

对于反应天然<= 0.59

npm install --save @redux-offline/redux-offline

2。添加offline商店增强compose

 import { applyMiddleware , createStore , compose } from 'redux' ;
import { offline } from '@redux-offline/redux-offline' ;
import offlineConfig from '@redux-offline/redux-offline/lib/defaults' ;

// ...

const store = createStore (
  reducer ,
  preloadedState ,
  compose (
    applyMiddleware ( middleware ) ,
    offline ( offlineConfig )
  )
) ; 

3。用离线元数据装饰动作

 const followUser = userId => ( {
  type : 'FOLLOW_USER_REQUEST' ,
  payload : { userId } ,
  meta : {
    offline : {
      // the network action to execute:
      effect : { url : '/api/follow' , method : 'POST' , json : { userId } } ,
      // action to dispatch when effect succeeds:
      commit : { type : 'FOLLOW_USER_COMMIT' , meta : { userId } } ,
      // action to dispatch if network action fails permanently:
      rollback : { type : 'FOLLOW_USER_ROLLBACK' , meta : { userId } }
    }
  }
} ) ;

如果效果有效载荷是JSON以外的其他方法，则可以通过身体和标题：

 const registerUser = ( name , email ) => ( {
  type : 'REGISTER_USER' ,
  payload : { name , email } ,
  meta : {
    offline : {
      // the network action to execute:
      effect : { url : '/api/register' , method : 'POST' , body : `name= ${ name } &email= ${ email } ` , headers : { 'content-type' : 'application/x-www-form-urlencoded' } } ,
      // action to dispatch when effect succeeds:
      commit : { type : 'REGISTER_USER_COMMIT' , meta : { name , email } } ,
      // action to dispatch if network action fails permanently:
      rollback : { type : 'REGISTER_USER_ROLLBACK' , meta : { name , email } }
    }
  }
} ) ; 

4。（反应本机Android）征求许可阅读网络状态

如果为Android编写本机应用程序，则需要确保请求访问AndroidManifest.xml中的网络状态的权限：

  < uses-permission android : name = " android.permission.ACCESS_NETWORK_STATE " />

---

有关配置选项，完整的API和常见配方，请参见文档。

贡献

欢迎改进和补充。有关大型更改，请在跳入编码之前提交讨论问题；我们讨厌您浪费努力。

如果要报告错误，请包括复制错误的代码。这是Codesandbox上的启动应用程序。

代替正式样式指南，请遵循随附的ESLINT规则，并使用更漂亮的格式化代码。

杂项

使用redux持续使用v5

如果您想使用自定义的Redux-Persist版本，则有一个示例配置。

先前的艺术

Redux离线是使用先前现有库构建应用程序时发现的模式的蒸馏：

• 福布斯·林德斯（Forbes Lindesay）的Redux-Optimist
• Zack Story的Redux-persist

没有他们的工作，Redux离线将不存在。如果您喜欢Redux离线背后的想法，但想从低级组件中构建自己的堆栈，那么这些是一个好的起点。

执照

麻省理工学院