导航颤动后的家长集团无法实现

Question

我已经在homepage中创建了cubit surveyscubit blocprovider 组件，现在，我想从在其子弹中推动的新页面访问它。

所有操作都很好，直到在此处达到按下页面，显示以下错误告诉我，在上一页上找不到surveysbloc：

BlocProvider.of() called with a context that does not contain a SurveysCubit.

这是主页：

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
  create: (_) =>
      SurveysCubit(repo: RepositoryProvider.of<SurveyRepository>(_)),
  child: Builder(builder: (newContext) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () => Navigator.push(
                newContext,
                MaterialPageRoute<void>(
                  builder: (BuildContext newContext) => Surveys(),
                ),
              ),
              child: const Text("Surveys"),
            ),
          ],
        ),
      ),
    );
  }),
);
  }
}

surveys ，推送页面：

class Surveys extends StatelessWidget {
  List<Survey> surveys = [];
  Surveys({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    surveys = BlocProvider.of<SurveysCubit>(context).getSurveys; //this call fails
    return Scaffold(
      body: ListView.builder(
        itemCount: surveys.length,
        itemBuilder: (context, i) => Column(
          children: [
            ShowSurvey(survey: surveys[i]),
            SizedBox(
              height: 20,
            ),
          ],
        ),
      ),
    );
  }
}

我知道我可以避免构建器小部件，但我想强制一个新的上下文创建。我认为我提供了正确的上下文，因此它应该起作用，我不明白发生了什么。

Answer 1

您想在2页之间分享您的cubit状态。您有2个选项可以实现这一目标，但首先让我解释什么blocprovider.of或navigator。
clasta.of意味着让我的祖先在上下文树中搜索类型的对象。
因此，当您键入Navigator.时，您会从树上上方的节点中获取Navigator对象，与BlocProvider.of相同。
现在回到您的问题，您在页面主页中提供了一个集团，然后尝试从调查页面访问它，现在此调查页面无法访问它，因为您要求获得的集团在调查的祖先节点页面中没有提供。 。
要解决此问题，您可以将BLOC实例作为参数传递以调查页面并用BlocProvider.Value包装孔页面，

class Surveys extends StatelessWidget {
  final cubit;
  Surveys({Key? key, required this.cubit}) : super(key: key);

  @override
  Widget build(BuildContext context) {
   return BlocProvider.value(
          value: cubit,
          child:....
          );
  }
}

或者在推动推销时直接包装页面（我不建议您使用此页面，因为每次您想使用此页面时，您都有要记住将其包裹在Bloc提供商中）

Navigator.push(
                newContext,
                MaterialPageRoute<void>(
                  builder: (BuildContext newContext) => BlocProvider.value(
                  value: BlocProvider.of<SurveysCubit>(newContext);
                  child: Surveys()
                  ),
                ),
              ),

或最后一个选项是您要在每个页面中访问Bloc时，不仅这2页只需用Bloc提供商将您的材料应用程序包装在主函数中。
现在，每当您致电blocprovider.of（上下文）时，您都会得到它。

Answer 2

首先，如果您的主页正在使用SurveyScubit我建议将其完全包装，而不是在build> build>的顶部声明blocprovider代码>方法。这将最大程度地减少您遇到此类问题的机会。

但是，如果您会坚持实施，我有几个提示。

• 从树上删除建筑商;它是定义nocelesswidget的内联替代方案。这里是多余的。
• 即使按下调查页面时，您将通过正确的上下文，因为repositoryProvider使用new throwaway 上下文上下文 _ 代码>显然没有存储库，或者它将是您的实现，而您的实现却误导了阅读它的人。

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (newContext) => SurveysCubit(
        repo: RepositoryProvider.of<SurveyRepository>(newContext),
      ),
      child: Scaffold(
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ElevatedButton(
                onPressed: () => Navigator.push(
                  newContext,
                  MaterialPageRoute<Surveys>(
                    builder: (_) => Surveys(),
                  ),
                ),
                child: const Text("Surveys"),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

如果这无济于事，则可能需要使用blocprovicer.value（）将包装。

其次，我通过在您的survey> survey页面中使用blocbuilder使用BLOC的力量建议，而不是一次读取Cubit值。您一次通过一次数据而失去对状态变化的响应能力。您想对更改做出反应的最佳情况，而不是重新加载页面以获取更改等。

请考虑以下内容：

class Surveys extends StatelessWidget {
  Surveys({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: BlocBuilder<SurveysCubit, SurveysState>(
        builder: (context, state) {
          return ListView.builder(
            itemCount: state.surveys.length,
            itemBuilder: (context, i) => Column(
              children: [
                ShowSurvey(survey: state.surveys[i]),
                const SizedBox(height: 20),
              ],
            ),
          );
        },
      ),
    );
  }
}

请确定它是否有效。