Flutter 的网页,“野生”计时器,有什么方法可以在按下F5键后停止计时器?

bgibtngc  于 2023-06-07  发布在  Flutter
关注(0)|答案(1)|浏览(120)

我有一个Flutter Web应用程序,其中一个小部件显示文本(实际上是一个时钟)。
定时器是一个Timer.periodic实现,如下所示:

class WatchText extends StatefulWidget {
  const WatchText({
    super.key,
  });

  @override
  State<WatchText> createState() => _WatchTextState();
}

class _WatchTextState extends State<WatchText> {

  late String _timeString;
  Timer? timer;

  @override
  void dispose() {
    timer?.cancel();
    super.dispose();
  }

  @override
  void initState() {
    _timeString = DateTime.now().to24HourMinuteSecondString();
    timer?.cancel();
    timer = Timer.periodic(const Duration(seconds: 1), (timer){

      setState(() {
        _timeString = DateTime.now().to24HourMinuteSecondString();
      });

      print("timer update : $_timeString");

    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Text(_timeString, style: const TextStyle(fontSize: 24,));
  }
}

触发器是这样的:

但是当用户点击F5按钮进行刷新时,突然有两个或更多的事件触发计时器:

如何捕获(并杀死)“野生”计时器事件?,在用户点击F5(甚至Ctrl+F5(在Chrome中))之后/当用户点击F5时?

fnx2tebb

fnx2tebb1#

修改initState,将super.initState();移动到顶部,并创建一个bool _isTimerRunning = false标志来检查计时器是否仍在运行,这样可能会解决您的问题。

initState

@override
  void initState() {
    super.initState();
    _timeString = DateTime.now().toIso8601String();
    _startTimer();
  }

_startTimer

void _startTimer() {
    if (!_isTimerRunning) {
      _timer = Timer.periodic(const Duration(seconds: 1), (timer) {
        setState(() {
          _timeString = DateTime.now().toIso8601String();
        });
        print("timer update: $_timeString");
      });
      _isTimerRunning = true;
    }
  }

相关问题