【问题标题】:Riverpod unwanted rebuilds of widget (I think)Riverpod 不需要的小部件重建(我认为)
【发布时间】:2021-02-21 07:22:14
【问题描述】:

我正在尝试使用 Riverpod 在登录时存储存储在 Firestore 中的用户信息。 我要存储的两条信息是用户的手机号码和他订阅的帐户。 如果这些字段为空,那么将向用户显示一个 QR 阅读器,该阅读器应该读取此信息并将其存储在 Firestore 并在本地更新riverpod

我的用户加载页面如下: 我收到错误setState() or markNeedsBuild() called during build.。 这是为什么? 我认为这是因为代码在更新构建方法的同时仍在构建。 但我对文档的理解是 context.read() 不应该重建小部件。

final subscribedToProvider = ChangeNotifierProvider((_) => SubscribedTo());
final userMobileProvider = ChangeNotifierProvider((_) => UserMobileProvider());

class LandingRouting extends StatelessWidget {
  const LandingRouting({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    User user = context.watch<User>();

    if (user == null) return LoginScreen();

    return FutureBuilder(
      future: FirebaseFirestore.instance.collection('users').doc(user.uid).get(),
      builder: (context, AsyncSnapshot<DocumentSnapshot> snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) return Loading();

        if (snapshot.hasError)
          return AlertDialog(
            title: Text('Error loading user'),
            content: Text('${snapshot.error.toString}'),
          );
        else {
          Map<String, dynamic> userData = snapshot.data.data();

          if (userData['userType'] == 'baqala') {
            return Theme(data: baqalaTheme, child: const BaqalaHomeScreen());
          } else {
            String subscribedTo = userData['subscribedTo'];
            String mobile = userData['mobile'];

            context.read(userMobileProvider).update(mobile);  // <--
            context.read(subscribedToProvider).update(subscribedTo); // <--

            return Theme(
              data: userTheme,
              child: UserHomeScreen(subscribedTo: subscribedTo, userMobile: mobile),
            );
          }
        }
      },
    );
  }
}

在 QR 页面中,riverpod 值为 null,但 firestore 值不为 null。 因此,在上一页中,这些值没有正确存储在 Riverpod 中。 我认为这是因为加载页面中的异常。

我在二维码页面里面的构建方法如下:

final subscribedToProvider = ChangeNotifierProvider((ref) => SubscribedTo());
final userMobileProvider = ChangeNotifierProvider((ref) => UserMobileProvider());

....

  @override
  Widget build(BuildContext context) {

    return Consumer(
      builder: (context, watch, child) {
        String sub = watch(subscribedToProvider).subscribedTo;
        String mob = watch(userMobileProvider).mobile;
        if (sub == null || mob == null) {
          return Column(
            children: [
              Expanded(
                flex: 3,
                child: QRView(key: qrKey, onQRViewCreated: _onQRViewCreated),
              ),
              Expanded(
                flex: 1,
                child: Center(
                  child: (result != null)
                      ? Text('Barcode Type: ${describeEnum(result.format)}   Data: ${result.code}')
                      : Text(
                          // 'Scan your code at your baqala to get your hisab history',
                          'Go to your baqala and request your QR code.\n'
                          'If your baqala has added you as a subscriber, you will be able to see\n'
                          'your account history\n\n',
                          style: TextStyle(fontSize: 18),
                          textAlign: TextAlign.center,
                        ),
                ),
              ),
            ],
          );
        }

        return History2(baqalaUID: sub, mobile: mob);
      },
    );

  }

  void _onQRViewCreated(QRViewController controller) {
    this.controller = controller;
    controller.scannedDataStream.listen(
      (scanData) async {
        setState(() => result = scanData);
        List<String> qrcode = scanData.code.split('-');

        context.read(subscribedToProvider).update(qrcode[0]);  // <-- Am I updating correctly
        context.read(userMobileProvider).update(qrcode[1]);

        await FirebaseFirestore.instance.collection('users').doc(CurrentUser.getCurrentUser().uid).update(
          {
            'subscribedTo': qrcode[0],
            'mobile': qrcode[1],
          },
        );
      },
    );
  }

我的供应商:

class SubscribedTo extends ChangeNotifier {
  String _subscribedTo;
  String get subscribedTo => _subscribedTo;

  void update(String subscribedTo) {
    _subscribedTo = subscribedTo;
    notifyListeners();
  }
}

class UserMobileProvider extends ChangeNotifier {
  String _mobile;
  String get mobile => _mobile;

  void update(String mobile) {
    _mobile = mobile;
    notifyListeners();
  }
}

【问题讨论】:

    标签: flutter riverpod


    【解决方案1】:

    您可以在 build 方法中读取状态,但不能更改它,因为根 ProviderScope 正在侦听它。这会导致您遇到的错误。

    要更正它,您应该创建一个 firebase 实例提供程序并使用提供程序之间的依赖关系来更新您的用户/firebase 实例完成加载时的状态。

    【讨论】:

      猜你喜欢
      • 2022-07-22
      • 1970-01-01
      • 1970-01-01
      • 2021-07-28
      • 2019-12-09
      • 2019-02-14
      相关资源
      最近更新 更多