Flutter 在小部件上找不到正确的提供程序

我对Flatter比较陌生，我正在构建一个应用程序，从API获取数据，并在不同的小部件上显示整个应用程序。我使用一个提供程序来执行API调用，并将反序列化的json存储在一个属性中，然后在initState函数中访问该属性。下面是my main.dart的小部件树，我想访问仪表板页面中的提供者，因为这是需要值的地方。我知道我做错了，但我做错了多少

  runApp(MaterialApp(
    home: LoginPage(),
    routes: routes,
  ));
}

class SampleApp extends StatefulWidget {
  @override
  SampleAppState createState() => SampleAppState();
}

class SampleAppState extends State<SampleApp> {
  int currentIndex = 0;
  final List<Widget> childPages = [
    Page1(),
    Page2(),
    Page3(),
    Page4()
  ];

  void onTapped(int index) {
    setState(() {
      currentIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (context) => APIProvider())
      ],
      child: Scaffold(
        body: childPages[currentIndex],
        bottomNavigationBar: BottomNavigationBar(
          onTap: onTapped,
          currentIndex: currentIndex,
          fixedColor: Colors.lightBlue,
          backgroundColor: Colors.white,
          type: BottomNavigationBarType.fixed,
          items: [
            BottomNavigationBarItem(
                icon: new Icon(Icons.dashboard),
                title: new Text('Page 1'),
                activeIcon: new Icon(
                  Icons.dashboard,
                  color: Colors.lightBlue,
                )),
            BottomNavigationBarItem(
                icon: new Icon(Icons.list),
                title: new Text('Page 2'),
                activeIcon: new Icon(
                  Icons.list,
                  color: Colors.lightBlue,
                )),
            BottomNavigationBarItem(
                icon: new Icon(Icons.collections_bookmark),
                title: new Text('Page 3'),
                activeIcon: new Icon(
                  Icons.collections_bookmark,
                  color: Colors.lightBlue,
                )),
            BottomNavigationBarItem(
                icon: new Icon(Icons.person),
                title: new Text('Page 4'),
                activeIcon: new Icon(
                  Icons.person,
                  color: Colors.lightBlue,
                )),
          ],
        ),
      ),
    );
  }
}

runApp（MaterialApp(
主页：登录页面（），
路线:路线,，
));
}
类SampleApp扩展StatefulWidget{
@凌驾
SampleAppState createState（）=>SampleAppState（）；
}
类SampleAppState扩展了状态{
int currentIndex=0；
最终列表子页面=[
第1页（），
第2页（），
第3页（），
第4页（）
];
void onTapped（整数索引）{
设置状态（）{
currentIndex=索引；
});
}
@凌驾
小部件构建（构建上下文）{
回程多供应商(
供应商：[
ChangeNotifierProvider（创建：（上下文）=>APIProvider（））
],
孩子：脚手架(
正文：子页面[当前索引]，
底部导航栏：底部导航栏(
onTap:onTapped，
currentIndex:currentIndex，
固定颜色：颜色。浅蓝色，
背景颜色：Colors.white，
类型：BottomNavigationBarType.fixed，
项目：[
底部导航气压计(
图标：新图标（图标.仪表板），
标题：新文本（“第1页”），
activeIcon：新图标(
图标。仪表板，
颜色：颜色。浅蓝色，
)),
底部导航气压计(
图标：新图标（Icons.list），
标题：新文本（“第2页”），
activeIcon：新图标(
图标列表，
颜色：颜色。浅蓝色，
)),
底部导航气压计(
图标：新图标（图标、收藏和书签），
标题：新文本（“第3页”），
activeIcon：新图标(
Icons.collections\u书签，
颜色：颜色。浅蓝色，
)),
底部导航气压计(
图标：新图标（Icons.person），
标题：新文本（“第4页”），
activeIcon：新图标(
一个人，
颜色：颜色。浅蓝色，
)),
],
),
),
);
}
}

然后，我尝试访问Page1中的provider值，如下所示：

@override
  void initState() {
    valueFromProvider =
        Provider.of<APIProvider>(context).providerValue;
    super.initState();
  }

@覆盖
void initState（）{
valueFromProvider=
Provider.of（context）.providerValue；
super.initState（）；
}

---

可能这是因为我试图在Page1小部件中访问的提供程序值为空，预加载我的提供程序会解决这个问题吗？

您没有在正确的时间提供提供提供程序。在本例中，您在第1页添加了MultiProvider，但您的上下文已经初始化，因此无法访问它。为了正确访问它，您必须将MultiProvider移动到初始化应用程序的位置，如下所示：

runApp(

MaterialApp(
    home: MultiProvider(
    providers: [
        ChangeNotifierProvider(create: (context) => APIProvider())
      ],
     child:LoginPage()
     ),
    routes: routes,
  ));

---

这应该可以解决您的问题。

明天我回到机器旁时，我会试一试，谢谢您的快速回复！我应该直接在需要值的小部件中访问提供程序，还是将值分配给变量并在initState函数中设置它是正确的？不，直接在小部件中访问提供程序。如果您正在读取一个值，那么使用消费者也会更有效。另外，作为一个后续问题，您是否认为我使用提供者从API调用返回数据会使我的应用程序的体系结构过于复杂？这对我帮助很大！谢谢，伙计，我欣赏代码的简单性：）