flutter_riverpod基础使用

第一种:

1.全局增加ProviderScope

void main() {
    return runApp(ProviderScope(child: MyApp()));
}

2.增加一个全局的store.dart文件,用于注册各个业务使用的store。以下是store.dart文件中的内容。

final userStore = ChangeNotifierProvider<UserStore>(
  (ref) => UserStore(),
);

final orderStore = ChangeNotifierProvider<OrderStore>(
  (ref) => OrderStore(),
);
...

3.实现实际的业务需要。

class UserStore extends ChangeNotifier {
 String name = "";
 getUserInfo() {
   Http.get(UrlUtil.userCenter, {}, (data) {
     UserCenterModel user = UserCenterModel().init(data);
     name = user.fullName; // 服务端data转app端的数据model。
     notifyListeners(); // 通知绑定了UserStore的每一个页面,刷新。
   });
 }
}

4.在具体的页面,使用store。让页面继承ConsumerWidget

import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:logistics/providers/stores.dart';
class AccountTest extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final notifier = ref.watch(userStore);
    return Scaffold(
      appBar: CustomAppBar(title: "测试"),
      body: Container(
        child: Center(
          child: Text("计数器: ${notifier.name}"),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          ref.read(userStore).getUserInfo();
        },
        child: const Icon(Icons.add),
      ),
    );
  }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容