首先,这是固执己见的。
尽管您已经描述了很多,但跟踪您的案例以及您(具体)如何实施它还是有点棘手。但我会尝试描述一些需要考虑的事情。
有几种方法可以处理这个问题。我会尽力回答你的问题。
- 始终或仅拥有无状态小部件和块并没有什么问题。
- 将 Stateful widget 和 Bloc 结合起来并没有什么问题。
- 考虑页面同时包含块和例如的情况。更新该页面上特定文本字段的计时器。为什么一个小部件应该同时处理这两种情况?听起来该页面可能是无状态的(使用块),其中包含文本字段,但该文本字段可以/应该是一个单独的 StatefulWidget,仅保存计时器或等效项。这意味着有时人们会在一个巨大的小部件中承担很多责任,而实际上它应该被分成几个较小的小部件。
- 我不明白为什么你会遇到这个错误,在有状态的小部件中同时拥有块和计时器是没有问题的,弹出并使用后退按钮并进行适当的处理和重置计时器。请参阅下面的完整代码示例。
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const FirstPage(),
);
}
}
class FirstPage extends StatelessWidget {
const FirstPage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('First page'),
),
body: Center(
child: ElevatedButton(
onPressed: () => Navigator.push(
context,
MaterialPageRoute(
builder: (context) => BlocProvider<FetcherCubit>(
create: (context) => FetcherCubit(),
child: const SecondPage(),
),
)),
child: const Text('Second page')),
),
);
}
}
class SecondPage extends StatefulWidget {
const SecondPage({super.key});
@override
State<SecondPage> createState() => _SecondPageState();
}
class _SecondPageState extends State<SecondPage> {
late final Timer myTimer;
int value = 0;
@override
void initState() {
super.initState();
myTimer = Timer.periodic(const Duration(seconds: 1), (timer) {
setState(() {
value++;
});
});
}
@override
void dispose() {
super.dispose();
myTimer.cancel();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Second page'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('Timer value: ${value.toString()}'),
ElevatedButton(
onPressed: () => context.read<FetcherCubit>().fetch(),
child: const Text('Fetch!'),
),
BlocBuilder<FetcherCubit, FetcherState>(
builder: (context, state) {
late final String text;
if (state is FetcherInitial) {
text = 'Initial';
} else if (state is FetcherLoading) {
text = 'Loading';
} else {
text = 'Completed';
}
return Text(text);
},
)
],
),
),
);
}
}
class FetcherCubit extends Cubit<FetcherState> {
FetcherCubit() : super(FetcherInitial());
Future<void> fetch() async {
emit(FetcherLoading());
await Future.delayed(const Duration(seconds: 3));
emit(FetcherCompleted());
}
}
@immutable
abstract class FetcherState {}
class FetcherInitial extends FetcherState {}
class FetcherLoading extends FetcherState {}
class FetcherCompleted extends FetcherState {}
如果你构建它,结果是: