![見出し画像](https://assets.st-note.com/production/uploads/images/125868317/rectangle_large_type_2_4bea997d0ae06e36955ebf8732b545eb.png?width=1200)
【Flutter/Dart】`ChangeNotifierProvider` と `Scaffold`は共存できる??🤔
`ChangeNotifierProvider` と `Scaffold` は、実際には共存できますが、その配置には注意が必要です。`ChangeNotifierProvider` は、状態管理クラス(この場合は `Sample`)のインスタンスを提供するために、ウィジェットツリーの上位に配置する必要があります。これにより、`Scaffold` やその他の子ウィジェットが `ChangeNotifierProvider` から提供されるデータをアクセスできます。
問題は、`ChangeNotifierProvider` を `Scaffold` の内部に配置することではなく、`MaterialApp` や `Scaffold` の外部で `ChangeNotifierProvider` を配置することです。これにより、アプリ全体で状態を共有できます。
正しい配置の例:
void main() {
runApp(
ChangeNotifierProvider(
create: (context) => Sample(),
child: MyApp(),
),
);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
// Scaffoldの内容
),
);
}
}
この配置では、`ChangeNotifierProvider` は `MaterialApp` の外部にあり、`MyApp`(および `Scaffold`)はその子として配置されています。これにより、`Scaffold` の内部で `Provider.of<Sample>(context)` を使用して、共有された状態にアクセスできます。
いいなと思ったら応援しよう!
![gorojy](https://assets.st-note.com/production/uploads/images/172166903/profile_a9600fc7e2166bc937e3b5560c69d5cc.png?width=600&crop=1:1,smart)