Retalk，Redux 从未如此简单
简介
Retalk 是 Redux 的一个最佳实践，简单、流畅而智慧。
特性
- 极简 Redux 实践：只需要
state和actions，简洁清晰。 - 只有两个 API：
createStore与withStore，再无其它繁杂概念。 - 异步引入 model：对 models 进行代码分隔的完整支持。
- 自动
loading处理：发送请求，接着使用自动的 loading 状态即可。
安装
Yarn
yarn add retalk
npm
npm install retalk
示例
1. Model
// demo/model.js
const model = {
state: {
value: 0,
},
actions: {
add() {
const { value } = this.state; // 使用 `this.state` 获取 state
this.setState({ value: value + 1 }); // 使用 `this.setState` 更新 state
},
async asyncAdd() {
await new Promise((resolve) => setTimeout(resolve, 1000));
this.add(); // 使用 `this[actionName]` 调用其它 action
},
},
};
export default model;2. Store
// store.js
import { createStore } from 'retalk';
import demo from './demo/model';
const store = createStore({
demo,
});
export default store;3. View
// demo/index.jsx
import React from 'react';
import { connect } from 'react-redux';
import { withStore } from 'retalk';
// Automatically `loading[asyncAction]` is ready to use
const Demo = ({ value，add，asyncAdd，loading }) => (
<div>
<h4>Value: {value}</h4>
<button onClick={add}>+1</button>
<button onClick={asyncAdd}>Async +1 {loading.asyncAdd ? '...' ：''}</button>
</div>
);
export default connect(...withStore('demo'))(Demo);只需要 3 步，一个简单的 Retalk 示例就呈现在眼前了。https://codesandbox.io/s/5l9mqnzvx
文档
查看 文档 了解更多详细信息。
更新
查看 更新日志 获取最新动态。
最后
Retalk 实现了 100% 的代码测试覆盖，欢迎尝试。
如果有什么问题和建议，欢迎提 Issues。
如果喜欢，欢迎加个 ★。
总之，尝试一下，你将体验到独一无二的全新 Redux 开发体验~
GitHub 地址：https://github.com/nanxiaobei...