未重建flutter riverpod ConsumerWidget
未重建flutter riverpod ConsumerWidget
提问于 2020-12-17 15:27:14
我刚刚在我写的一个小应用中实现了riverpod。
flutter_riverpod：^0.12.1
我的问题是，当我更新一个提供程序时，尽管调用了“watch”，但小部件并没有被重新构建。
提供者本质上跟踪应该显示的当前页面。
import 'dart:developer';
import 'package:flutter_riverpod/flutter_riverpod.dart';
final currentPageProvider = StateNotifierProvider((ref) => CurrentPage());
class CurrentPage extends StateNotifier<int> {
CurrentPage() : super(-1);
set currentPage(int page) {
log('currentPage set to $page');
state = page;
}
int get currentPage => state;
}PageButtons小部件绘制一组RaisedButtons。当用户单击其中一个凸起的按钮时，当前页面编号。应该更改，并且应该重新构建PageButton小部件，以便我们可以更改与当前页面相对应的RaisedButton的颜色。
import 'dart:developer';
import 'dart:math' hide log;
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:fsm2/fsm2.dart' hide State;
import 'package:fsm2_viewer/src/providers/current_page.dart';
import 'package:fsm2_viewer/src/providers/log_provider.dart';
class PageButtons extends ConsumerWidget {
final List<SvgFile> pages;
PageButtons(this.pages);
@override
Widget build(BuildContext context, ScopedReader watch) {
/// watch the currentPageProvider so we are rebuilt when the page
/// no changes.
int currentPage = watch(currentPageProvider).currentPage;
log('building PageButons currentPage: $currentPage');
if (pages.length == 0) {
return Container(width: 0, height: 0);
}
currentPage = min(currentPage, pages.length - 1);
var buttons = <Widget>[];
for (var pageNo = 0; pageNo < pages.length; pageNo++) {
buttons.add(Padding(
padding: EdgeInsets.only(right: 5, left: 5),
child: RaisedButton(
color: (pageNo == currentPage ? Colors.blue : Colors.grey),
onPressed: () {
context.read(logProvider).log = 'onpressed';
/// User click the page button so update the current page.
context.read(currentPageProvider).currentPage = pageNo;
context.read(logProvider).log = 'changed to page $pageNo';
},
child: Text('${pageNo + 1}'))));
}
return Row(children: buttons);
}
}您可以在上面的构建方法中看到，我称之为watch：
int currentPage = watch(currentPageProvider).currentPage;然后，在提升按钮的onPressed中，我更新了currentPage：
onPressed: () {
/// User click the page button so update the current page.
context.read(currentPageProvider).currentPage = pageNo;
context.read(logProvider).log = 'onpressed';
context.read(logProvider).log = 'changed to page $pageNo';在我的日志中，我看到：
main:ALL> onpressed
main:ALL> currentPage set to 1
main:ALL> changed to page 1日志告诉我正在调用onPressed方法，并且我正在更新currentPageProvider。
然而，PageButton的构建器并没有被调用。
我做错了什么？
回答 1
Stack Overflow用户
发布于 2021-03-01 08:56:24
import 'dart:developer';
import 'dart:math' hide log;
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:fsm2/fsm2.dart' hide State;
import 'package:fsm2_viewer/src/providers/current_page.dart';
import 'package:fsm2_viewer/src/providers/log_provider.dart';
class PageButtons extends ConsumerWidget {
final List<SvgFile> pages;
PageButtons(this.pages);
@override
Widget build(BuildContext context, ScopedReader watch) {
/// watch the currentPageProvider so we are rebuilt when the page
/// no changes.
int currentPage = watch(currentPageProvider.state);
log('building PageButons currentPage: $currentPage');
if (pages.length == 0) {
return Container(width: 0, height: 0);
}
currentPage = min(currentPage, pages.length - 1);
var buttons = <Widget>[];
for (var pageNo = 0; pageNo < pages.length; pageNo++) {
buttons.add(Padding(
padding: EdgeInsets.only(right: 5, left: 5),
child: RaisedButton(
color: (pageNo == currentPage ? Colors.blue : Colors.grey),
onPressed: () {
context.read(logProvider).log = 'onpressed';
/// User click the page button so update the current page.
context.read(currentPageProvider).currentPage = pageNo;
context.read(logProvider).log = 'changed to page $pageNo';
},
child: Text('${pageNo + 1}'))));
}
return Row(children: buttons);
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65336261
复制相关文章
相似问题
腾讯云开发者
