首页 > 解决方案 > 如何使用 Flutter Riverpod 充当 ChangeNotifierProxy Provider?

问题描述

只是想知道是否有任何方法可以以某种方式使用 Riverpod 包,它就像 ChangeNotifierProxy Provider 一样工作。我制作了这个简单的代码,其中“MyFirstClass”更改其属性时应更新“MySecondClass”。在“MySecondClass”中,是一种在“MyFirstClass”发生更改时使用数据/变量的方法。

到目前为止,当我按下按钮并执行 onPressed 函数时,'MySecondClass' 会更新一次,但即使我再次按下按钮也会保持不变。

这是提供者和类的部分:

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

final firstClassProvider = ChangeNotifierProvider((ref) => MyFirstClass());

final secondClassProvider = ChangeNotifierProvider<MySecondClass>(
    (ref) => MySecondClass(MyFirstClass().myFirstNumber));

class MyApp extends ConsumerWidget {
  @override
  Widget build(BuildContext context, ScopedReader watch) {
    final firstClassNotifier = watch(firstClassProvider);
    final secondClassNotifier = watch(secondClassProvider);

    return MaterialApp(...


class MyFirstClass extends ChangeNotifier {
  int _myFirstNumber = 10;

  void increaseMyFirstNumber() {
    _myFirstNumber = _myFirstNumber + 1;
    notifyListeners();
  }

  get myFirstNumber => _myFirstNumber;
}

class MySecondClass extends ChangeNotifier {
  MySecondClass(this.data);
  final int data;

  int _mySecondNumber = 2;

  void receiveNumberFromClass1() {
    _mySecondNumber = data;
    print('$data Data');
    notifyListeners();
  }

  get mySecondNumber => _mySecondNumber;
}

如果你想复制这个例子的整个代码,这里是:

   import 'package:flutter/material.dart';
import 'package:flutter_riverpod/all.dart';
import 'package:riverpod/riverpod.dart';
import 'package:riverpod/all.dart';

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

final firstClassProvider = ChangeNotifierProvider((ref) => MyFirstClass());

final secondClassProvider = ChangeNotifierProvider<MySecondClass>(
    (ref) => MySecondClass(MyFirstClass().myFirstNumber));

class MyApp extends ConsumerWidget {
  @override
  Widget build(BuildContext context, ScopedReader watch) {
    final firstClassNotifier = watch(firstClassProvider);
    final secondClassNotifier = watch(secondClassProvider);

    return MaterialApp(
      home: Scaffold(
        body: Container(
          color: Colors.blueGrey,
          alignment: Alignment.center,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Text(
                firstClassNotifier._myFirstNumber.toString(),
                style: TextStyle(fontSize: 40),
              ),
              Text(secondClassNotifier.mySecondNumber.toString()),
              MaterialButton(
                  child: Container(
                    height: 50,
                    width: 50,
                    color: Colors.deepOrangeAccent,
                  ),
                  onPressed: () {
                    firstClassNotifier.increaseMyFirstNumber();
                    secondClassNotifier.receiveNumberFromClass1();
                  }),
            ],
          ),
        ),
      ),
    );
  }
}

class MyFirstClass extends ChangeNotifier {
  int _myFirstNumber = 10;

  void increaseMyFirstNumber() {
    _myFirstNumber = _myFirstNumber + 1;
    notifyListeners();
  }

  get myFirstNumber => _myFirstNumber;
}

class MySecondClass extends ChangeNotifier {
  MySecondClass(this.data);
  final int data;

  int _mySecondNumber = 2;

  void receiveNumberFromClass1() {
    _mySecondNumber = data;
    print('$data Data');
    notifyListeners();
  }

  get mySecondNumber => _mySecondNumber;
}

标签: flutterflutter-change-notifierriverpod

解决方案


在做了一些研究和测试后,我找到了一种方法。不确定这是否是您应该这样做的方式。但到目前为止它工作正常。这就是我添加的代码:

final firstClassProvider = ChangeNotifierProvider((ref) => MyFirstClass());

final secondClassProvider = ChangeNotifierProvider<MySecondClass>((ref) {
  final secondClass = MySecondClass(MyFirstClass().myFirstNumber);
  return secondClass;
});


class MySecondClass extends ChangeNotifier {
  MySecondClass(this.data);
  final int data;

  int _mySecondNumber = 2;
  int _myOtherNumber = 8;

  void updateClass2(number) {
    _myOtherNumber = number;
    print('$_myOtherNumber other Number');
  }

  void receiveNumberFromClass1() {
    _mySecondNumber = _myOtherNumber;
    print('$data Data');
    notifyListeners();
  }

  get mySecondNumber => _mySecondNumber;
}

推荐阅读