Flutter:如何正确地将 Provider.of 方法放入 StatefulWidget 中,以便在我的代码中使用 Dispose()?

Flutter: How Do I Properly Seat a Provider.of Method into a StatefulWidget so Dispose() Can Be Used in My Code?

简介: 我花了一个多小时在 Whosebug 上寻找这个答案;所以,我犹豫地决定问这个我认为没有答案的问题。我希望它不会重复已经回答过的令人作呕的内容。

在过去的五个星期里,我一直沉浸在 BLoC 模式的研究中(是的,我知道我落后了大约一年)。我一直在观看几个视频并阅读有关该主题的几本书。我了解到,如果没有调用 dispose 方法,就会发生内存泄漏。在我最近看的很多YouTube视频中,推荐使用有状态的widget而不是无状态的widget,这样在应用程序的生命周期中就可以使用dispose方法来防止内存泄漏。

问题: 什么是安装 Inherited Widget 的正确方法,通过 Provide.of 方法,以获得有状态小部件上下文的范围,因此可以在生命周期内使用 dispose() 方法?

相关代码:

import 'package:flutter/material.dart';

import 'package:testingblock6/counter_provider.dart';
import 'counter_event.dart';
import 'model.dart';

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    final _bloc = Provider.of(context);

    return Scaffold(
      appBar: AppBar(
        title: Text('Testing Bloc 6'),
      ),
      body: Center(
          child: StreamBuilder<Model>(
        stream: _bloc.modelStream,
        initialData: Model(),
        builder: (BuildContext context, AsyncSnapshot<Model> snapshot) {
          return Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                'You have pushed the button this many times:',
              ),
              Text(
                'Counter: ${snapshot.data.counter}',
                style: Theme.of(context).textTheme.display1,
              ),
              Text(
                'ThisGuy: ${snapshot.data.thisGuy}',
                style: Theme.of(context).textTheme.display1,
              ),
            ],
          );
        },
      )),
      floatingActionButton: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: <Widget>[
          FloatingActionButton(
            onPressed: () => _bloc.counterEventSink.add(IncrementEvent()),
            tooltip: 'Increment',
            child: Icon(Icons.add),
          ),
          SizedBox(width: 10),
          FloatingActionButton(
            onPressed: () => _bloc.counterEventSink.add(DecrementEvent()),
            tooltip: 'Decrement',
            child: Icon(Icons.remove),
          ),
          SizedBox(width: 10),
          FloatingActionButton(
            onPressed: () => _bloc.counterEventSink.add(ThisGuy()),
            tooltip: 'ThisGuy',
            child: Icon(Icons.golf_course),
          ),
        ],
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }

  @override
  void dispose() {
    super.dispose();
    // _bloc.dispose();
  }
}

问题: 我认为必须在代码的 _HomeState 区域内调用 Provider.of 方法,因为这是上下文可用的地方。但是,这样做会将其从 dispose 方法的范围中移除。

问题:关于 dispose() 方法范围的可用性,我做错了什么,有没有我没有看到的答案?

import 'package:flutter/material.dart';

import 'counter_event.dart';
import 'counter_provider.dart';
import 'model.dart';

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  var _bloc;

  @override
  Widget build(BuildContext context) {
    _bloc = Provider.of(context);

    return Scaffold(
      appBar: AppBar(
        title: Text('Testing Bloc 6'),
      ),
      body: Center(
          child: StreamBuilder<Model>(
        stream: _bloc.modelStream,
        initialData: Model(),
        builder: (BuildContext context, AsyncSnapshot<Model> snapshot) {
          return Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                'You have pushed the button this many times:',
              ),
              Text(
                'Counter: ${snapshot.data.counter}',
                style: Theme.of(context).textTheme.display1,
              ),
              Text(
                'ThisGuy: ${snapshot.data.thisGuy}',
                style: Theme.of(context).textTheme.display1,
              ),
            ],
          );
        },
      )),
      floatingActionButton: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: <Widget>[
          FloatingActionButton(
            onPressed: () => _bloc.counterEventSink.add(IncrementEvent()),
            tooltip: 'Increment',
            child: Icon(Icons.add),
          ),
          SizedBox(width: 10),
          FloatingActionButton(
            onPressed: () => _bloc.counterEventSink.add(DecrementEvent()),
            tooltip: 'Decrement',
            child: Icon(Icons.remove),
          ),
          SizedBox(width: 10),
          FloatingActionButton(
            onPressed: () => _bloc.counterEventSink.add(ThisGuy()),
            tooltip: 'ThisGuy',
            child: Icon(Icons.golf_course),
          ),
        ],
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }

  @override
  void dispose() {
    super.dispose();
    _bloc.dispose();
  }
}