Слияние кода завершено, страница обновится автоматически
Redux Model создан для улучшения оригинальной библиотеки Redux, которая имеет сложный поток управления и множество шаблонных конструкций.
npm install @redux-model/react
# Для Taro 3+ версий
npm install @redux-model/taro
# Для Taro 2+ версий
npm install @redux-model/taro@6.10.0 @tarojs/redux
# Для Taro 1+ версий
npm install @redux-model/taro@6.9.5 @tarojs/redux
# Для Vue 3+ версий
npm install @redux-model/vue
# Для Vue 2+ версий
npm install @redux-model/vue@6.9.2
interface Ответ {
id: number;
имя: string;
}
interface Данные {
счетчик: number;
пользователи: Partial<{
[ключ: string]: Ответ;
}>;
}
``````typescript
class TestModel extends Model<Данные> {
увеличить = this.action((состояние, шаг: число = 1) => {
состояние.счетчик += шаг;
});
получитьПользователя = $api.action((id: число) => {
return this
.get<Ответ>(`/api/users/${id}`)
.наУспешныйРезультат((состояние, действие) => {
состояние.пользователи[id] = действие.ответ;
});
});
защищённое_начальное_состояние(): Данные {
return {
счетчик: 0,
пользователи: {},
};
}
}
экспортировать const testModel = новый TestModel();
testModel.увеличить();
testModel.увеличить(2);
testModel.получитьПользователя(3);
testModel.получитьПользователя(5).тогда(({ ответ }) => {});
const данные = testModel.использоватьДанные(); // { счетчик: число, пользователи: объект }
const счетчик = testModel.useData((data) => data.counter); // число
const пользователи = testModel.useData((data) => data.users); // объект
const загрузка = testModel.getUser.useLoading(); // логическое значение
type ReactProps = ReturnType<typeof mapStateToProps>;
const mapStateToProps = () => {
return {
counter: testModel.data.counter, // число
users: testModel.data.users, // объект
loading: testModel.getUser.loading, // логическое значение
};
};
экспортировать default connect(mapStateToProps)(App);
```# Онлайн-демо
* [Счетчик](https://codesandbox.io/s/redux-model-react-counter-zdgjh)
* [Устойчивость](https://codesandbox.io/s/redux-model-react-persist-uwhy8)
* [Список задач](https://codesandbox.io/s/redux-model-react-todo-list-zn4nv)
* [Запрос](https://codesandbox.io/s/redux-model-react-request-1ocyn)
* [Ограничение частоты запросов](https://codesandbox.io/s/redux-model-react-request-throttle-77mfy)
* [Прослушивание](https://codesandbox.io/s/redux-model-react-listener-p7khk)
* [Композиция](https://codesandbox.io/s/redux-model-react-compose-42wrc)
* [Действие в действии](https://codesandbox.io/s/redux-model-react-action-in-action-oewkv)# Документация
Здесь находится [документация](https://redux-model.github.io/redux-model)
# Разработка
* git clone YOUR_FORK_REPO
* yarn install && yarn bootstrap
Чтобы запустить тесты, выполните `yarn test`<br>
Чтобы отредактировать документацию, выполните `yarn docs`
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )