flutter 状态管理

有状态和无状态

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      title: '有状态和无状态组件',
      home: MyHomePageOne(
        title: '游乐园',
      ),
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
    );
  }
}
class MyHomePageOne extends StatefulWidget {
  MyHomePageOne({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePageOne> {
  int _counter = 0;

  void _inAddCounter() {
    //调用state类里的setState方法来改变状态值,似的计数器加1
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('有状态和无状态管理')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('点击右下角按钮的次数'),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        tooltip: '增加',
        child: Icon(Icons.add),
        onPressed: _inAddCounter,
      ),
    );
  }
}

provider使用

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MultiProvider(
        providers: [
          ChangeNotifierProvider(builder: (_) => Counter()),
        ],
        child: MaterialApp(
          title: 'provider示例',
          home: FirstPage(),
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
        ));
  }
}

/*
* 计算器类Counter即为model,实际上是状态,
* Counter不仅存储数据,而且还包含了更改数据的方法,并曝露相关数据
* 使用mixin混入ChangeNotifier类,这个类能自动管理所有听众.
* 当调用notifyListeners时,它会通知所有听众进行刷新
* */

class Counter with ChangeNotifier {
  //存储数据
  int _count = 0;

  //提供外部能够访问的数据
  int get count => _count;

  //提供更改数据的方法

  void increment() {
    _count++;

    //通知所有听众进行刷新
    notifyListeners();
  }
}

class FirstPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text('第一个页面'),
        actions: <Widget>[
          FlatButton(
            child: Text('下一页'),
            onPressed: () =>
                Navigator.push(context, MaterialPageRoute(builder: (context) {
              return SecondPage();
            })),
          )
        ],
      ),
      body: Center(
        child: Text('${Provider.of<Counter>(context).count}'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          Provider.of<Counter>(context).increment();
        },
        child: Icon(Icons.add),
      ),
    );
  }
}

class SecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text('第二个页面'),
      ),
      body: Center(
        child: Text('${Provider.of<Counter>(context).count}'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          Provider.of<Counter>(context).increment();
        },
        child: Icon(Icons.add),
      ),
    );
  }
}