Flutter中不依赖外部包及onChanged实现变量值变化时执行指定代码的方案咨询

嘿，我来帮你搞定这个问题！既然你不想用外部包，也没法借助TextFormField的onChanged，那咱们用Flutter自带的ValueNotifier就完全能实现需求，这是官方原生的轻量状态管理工具，完全不需要额外依赖~

核心思路 #

ValueNotifier是Flutter SDK内置的类，它可以持有一个单一值，并且在值发生变化时通知所有监听它的对象。我们可以通过给它添加监听器，或者配合ValueListenableBuilder来实现变量变化时执行指定任务的效果。

具体实现步骤 #

1. 声明ValueNotifier变量

首先，根据你要监听的变量类型，声明一个ValueNotifier实例。比如你要监听字符串类型：

final ValueNotifier<String> _targetVariable = ValueNotifier<String>('初始值');

如果是数字类型也一样，把泛型改成int或double就行。

2. 方式一：直接添加监听器执行代码

如果不需要关联UI更新，只是想在变量变化时执行逻辑，你可以在Widget的生命周期里添加监听器：

@override
void initState() {
  super.initState();
  // 添加监听器，指定变量变化时调用的方法
  _targetVariable.addListener(_handleVariableChange);
}

// 变量变化时执行的任务方法
void _handleVariableChange() {
  print('变量更新啦，新值是：${_targetVariable.value}');
  // 在这里写你需要执行的具体逻辑，比如调用接口、更新其他状态等
}

@override
void dispose() {
  // 记得在组件销毁时移除监听器并释放资源，避免内存泄漏
  _targetVariable.removeListener(_handleVariableChange);
  _targetVariable.dispose();
  super.dispose();
}

3. 方式二：用ValueListenableBuilder关联UI和逻辑

如果需要同时更新UI并执行逻辑，ValueListenableBuilder会更方便，它会自动监听变量变化并重建子组件：

@override
Widget build(BuildContext context) {
  return ValueListenableBuilder<String>(
    valueListenable: _targetVariable,
    builder: (context, currentValue, child) {
      // 这里可以执行变量变化时的任务
      print('变量值变更为：$currentValue');
      
      // 返回需要更新的UI组件
      return Column(
        children: [
          Text('当前值：$currentValue'),
          ElevatedButton(
            onPressed: () {
              // 点击按钮更新变量值，触发监听逻辑
              _targetVariable.value = '新的测试值';
            },
            child: Text('更新变量'),
          ),
        ],
      );
    },
  );
}

4. 更新变量值的方式

不管用哪种方式，更新变量值只需要直接给ValueNotifier的value属性赋值就行：

// 在任意地方赋值，比如按钮点击、接口回调里
_targetVariable.value = '这是新的值';

针对自定义类型的注意事项 #

如果你要监听的是自定义类的实例，要确保你的类是不可变类（所有属性都是final），并且更新时创建新的实例，因为ValueNotifier只会检测value的引用变化：

// 自定义不可变类
class UserInfo {
  final String name;
  final int age;
  
  UserInfo(this.name, this.age);
}

// 声明ValueNotifier
final ValueNotifier<UserInfo> _userInfo = ValueNotifier<UserInfo>(UserInfo('Utkarsh', 25));

// 更新时创建新实例
_userInfo.value = UserInfo('Utkarsh', 26);

这样就完全不需要依赖任何外部包，也不用借助TextFormField的onChanged，就能实现变量变化时执行指定任务的需求啦！

备注：内容来源于stack exchange，提问作者Utkarsh