面试题：Flutter 中 Provider 实现跨页面状态共享的基本步骤

创建状态管理类：
- 首先创建一个继承自 ChangeNotifier 的类，该类用于管理共享状态。例如：
```
import 'package:flutter/foundation.dart';

class CounterModel extends ChangeNotifier {
  int _count = 0;

  int get count => _count;

  void increment() {
    _count++;
    notifyListeners();
  }
}
```
- 在这个类中，定义状态变量（如 _count）以及改变状态的方法（如 increment），当状态改变时调用 notifyListeners 通知依赖该状态的组件。

注册 Provider：

在 main.dart 文件中，使用 MultiProvider 或 Provider 将状态管理类注册到应用中。例如，使用 MultiProvider 注册多个 Provider：

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

void main() {
  runApp(
    MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (context) => CounterModel()),
      ],
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Provider Demo',
      home: HomePage(),
    );
  }
}

这里通过 ChangeNotifierProvider 将 CounterModel 注册为一个可共享的状态，create 回调函数用于创建状态管理类的实例。

在不同页面中获取和使用共享状态：

获取状态：在需要使用共享状态的页面中，通过 Provider.of 方法获取状态管理类的实例。例如在一个 StatelessWidget 中：

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

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final counter = Provider.of<CounterModel>(context);
    return Scaffold(
      appBar: AppBar(
        title: Text('Provider Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('Count: ${counter.count}'),
            ElevatedButton(
              onPressed: () {
                counter.increment();
              },
              child: Text('Increment'),
            ),
          ],
        ),
      ),
    );
  }
}

这里通过 Provider.of<CounterModel>(context) 获取到 CounterModel 的实例 counter，然后可以使用其状态（如 counter.count）和方法（如 counter.increment）。如果在 StatefulWidget 中，可以使用 context.watch<CounterModel>() 或 context.read<CounterModel>()，context.watch 会在状态变化时重建组件，context.read 不会因状态变化重建组件。

通过以上步骤，就可以在 Flutter 应用中利用 Provider 实现跨页面状态共享。

面试题：Flutter 中 Provider 实现跨页面状态共享的基本步骤

知识考点

面试题答案