Yet another store using redux. (Inspired by vuex and dva). 这仅仅是一个 store管理的库。
项目地址:https://github.com/d-band/yax
- 基于 redux,相当于扩展了一下 redux
- 很多代码参考于 vuex,不同的是主要用于 react
- 思想参考了 dva,但与 dva 不同:这不是一个框架只是一个 store 管理库
简单的 Demo:
import yax from 'yax';
const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
const count = {
state: 0,
reducers: {
addDone (state, payload) {
return state + payload;
},
minusDone (state, payload) {
return state - payload;
}
},
actions: {
async add ({ commit }, payload) {
await delay(1);
commit('addDone', payload);
},
async minus ({ commit }, payload) {
await delay(1);
commit('minusDone', payload);
}
}
};
const store = yax({
modules: { count }
});
store.subscribe(() =>
console.log(store.getState())
);
store.dispatch({
type: 'count/add',
payload: 2
});
store.dispatch({
type: 'count/minus',
payload: 1
});
结合 React 使用
import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import yax from 'yax';
import count from './count';
import App from './App';
const store = yax({
modules: { count }
});
render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root')
);
结合 ReactNative 使用
import yax from 'yax';
import { AsyncStorage } from 'react-native';
import { persistStore, autoRehydrate } from 'redux-persist';
const store = yax({
modules: { count }
}, autoRehydrate());
persistStore(store, { storage: AsyncStorage })
来写一个简单的 RN 应用
仿照 Google Authenticator 写的一个 ReactNative 应用,项目地址:https://github.com/d-band/RnTotp,附个截图: