Flutter原始状态管理插件raw

Flutter原始状态管理插件raw_state的使用

特性

Flutter小部件是封装好的。故意使其难以在小部件之间共享数据。为了解决这个问题，编写了许多状态管理包，如flutter_riverpod、provider、flutter_bloc、getx和mobx等。这些包都非常好用，但它们也非常复杂。这对许多Flutter开发者来说是一个入门门槛。

RawState使得在一个小部件中设置状态并在另一个小部件中读取变得非常简单。

入门指南

在添加了pub add raw_state或flutter pub add raw_state之后，在每个需要读取或写入状态的文件顶部导入它：

import 'package:raw_state/raw_state.dart';

这将暴露一个新的全局变量rawState。

使用方法

在任何文件中设置值

rawState.set('someInt', 77); // 设置整型值
rawState.set('someMap', {"foo":"bar","baz":"qux"}); // 设置映射类型值
rawState.set('someString', "Can it really be this simple?"); // 设置字符串类型值

在任何文件中读取值

这可以是在同一个文件/小部件中，也可以是完全不同的文件/小部件中。

int i = rawState.get<int>('someInt'); // 读取整型值
Map m = rawState.get<Map>('someMap'); // 读取映射类型值
String s = rawState.get<String>('someString'); // 读取字符串类型值

注意：如果键不存在或包含null，.get()会抛出异常。对于可空类型，应使用.maybeGet()。

读取一个可空值或未设置的值

int? i = rawState.maybeGet<int>('someInt'); // 读取可能为空的整型值
Map? m = rawState.maybeGet<Map>('someMap'); // 读取可能为空的映射类型值
String? s = rawState.maybeGet<String>('someString'); // 读取可能为空的字符串类型值

更多关于Flutter原始状态管理插件raw_state的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

bupafengyu 1楼

更多关于Flutter原始状态管理插件raw_state的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

在Flutter中，raw_state 是一个轻量级的状态管理插件，它允许你以最简单的方式管理应用程序的状态。raw_state 的核心思想是使用 ValueNotifier 和 ValueListenableBuilder 来管理状态，并且它非常适合小型应用程序或简单的状态管理需求。

安装 `raw_state`

首先，你需要在 pubspec.yaml 文件中添加 raw_state 依赖：

dependencies:
  flutter:
    sdk: flutter
  raw_state: ^1.0.0  # 请使用最新版本

然后运行 flutter pub get 来安装依赖。

使用 `raw_state`

raw_state 的核心是 RawState 类，它是一个 ValueNotifier 的封装，允许你通过 value 属性来存储和更新状态。

1. 创建一个 `RawState` 实例

import 'package:raw_state/raw_state.dart';

final counterState = RawState<int>(0);

这里我们创建了一个 RawState 实例，初始值为 0。

2. 在UI中使用 `RawState`

你可以使用 ValueListenableBuilder 来监听 RawState 的变化，并在状态变化时更新UI。

import 'package:flutter/material.dart';
import 'package:raw_state/raw_state.dart';

void main() {
  runApp(MyApp());
}

final counterState = RawState<int>(0);

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('RawState Example')),
        body: Center(
          child: ValueListenableBuilder<int>(
            valueListenable: counterState,
            builder: (context, value, child) {
              return Text('Counter: $value');
            },
          ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            counterState.value++;  // 更新状态
          },
          child: Icon(Icons.add),
        ),
      ),
    );
  }
}

在这个例子中，ValueListenableBuilder 监听 counterState 的变化，并在每次点击浮动按钮时更新计数器。

3. 更新状态

你可以通过直接修改 RawState 的 value 属性来更新状态：

counterState.value = 10;  // 直接设置新值
counterState.value++;     // 递增
counterState.value--;     // 递减

4. 监听状态变化

你还可以通过 addListener 方法来监听状态的变化：

counterState.addListener(() {
  print('Counter changed to: ${counterState.value}');
});

Flutter原始状态管理插件raw_state的使用