Flutter店铺管理插件store_keeper的使用
Flutter店铺管理插件store_keeper的使用
StoreKeeper 是一个为 Flutter 应用设计的状态管理库,专注于简单性。它受到了 JavaScript 领域类似库的启发。以下是其基本工作原理:
- 单个存储库来保存应用的数据
- 结构化的修改通过突变(Mutations)进行
- 小部件监听突变以重新构建自身
- 使用拦截器(Interceptors)和副作用(SideEffects)增强这一过程
StoreKeeper 的核心基于 Flutter 的 InheritedModel
小部件,并且最初是为 2018 年初的 Kite 应用开发的后端。之后它被分离出来成为这个库。现在它已经在多个应用中生产使用,包括 Coin、Olam 和 Hackly。
开始使用
在 pubspec.yaml
文件中添加依赖:
dependencies:
...
store_keeper: ^1.0.0
创建一个存储库:
import 'package:store_keeper/store_keeper.dart';
class AppStore extends Store {
int count = 0;
}
定义突变:
class Increment extends Mutation<AppStore> {
exec() => store.count++; // 增加计数
}
class Multiply extends Mutation<AppStore> {
final int by;
Multiply({required this.by});
exec() => store.count *= by; // 将计数乘以指定值
}
监听突变:
[@override](/user/override)
Widget build(BuildContext context) {
// 定义何时此小部件应重新渲染
StoreKeeper.listen(context, to: [Increment, Multiply]);
// 获取对存储库的访问
final store = StoreKeeper.store as AppStore;
return Text("${store.count}");
}
完整的示例:
import 'package:flutter/material.dart';
import 'package:store_keeper/store_keeper.dart';
// 构建存储库并使其成为应用的一部分
void main() {
runApp(StoreKeeper(
store: AppStore(),
child: MyApp(),
));
}
// 存储库定义
class AppStore extends Store {
int count = 0;
}
// 突变定义
class Increment extends Mutation<AppStore> {
exec() => store.count++; // 增加计数
}
class Multiply extends Mutation<AppStore> {
final int by;
Multiply({required this.by});
exec() => store.count *= by; // 将计数乘以指定值
}
class MyApp extends StatelessWidget {
[@override](/user/override)
Widget build(BuildContext context) {
// 定义何时此小部件应重新渲染
StoreKeeper.listen(context, to: [Increment, Multiply]);
// 获取对存储库的访问
final store = StoreKeeper.store as AppStore;
return MaterialApp(
home: Scaffold(
body: Column(
children: <Widget>[
Text("Count: ${store.count}"), // 显示当前计数值
ElevatedButton(
child: Text("Increment"), // 增加按钮
onPressed: () {
// 触发突变
Increment();
},
),
ElevatedButton(
child: Text("Multiply"), // 乘法按钮
onPressed: () {
// 触发带参数的突变
Multiply(by: 2);
},
),
],
),
),
);
}
}
更多关于Flutter店铺管理插件store_keeper的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
1 回复