Flutter Cubit 状态不离开起点(MyInitialState)

Posted

技术标签:

【中文标题】Flutter Cubit 状态不离开起点(MyInitialState)【英文标题】:Flutter Cubit state does not leave the starting point (MyInitialState) 【发布时间】:2020-12-15 18:34:17 【问题描述】:

我正在学习 cubit / bloc 但是当我有一个从 json 文件加载信息的页面时,我的状态不会改变。

我不知道发生了什么,因为它没有返回任何错误,但通过打印我可以跟踪当前状态。 我也没有找到使用这种方式的信息来源,不需要点击什么的

我的腕尺

   class AgentesCubit extends Cubit<AgentesState> 
      final AgentesRepository _agentesRepository = JsonAgentesRepository();
      AgentesCubit() : super(AgentesInitial());
      List<Agentes> listAgentes;
    
      getAgentes() async 
        try 
          emit(AgentesLoading());
          _agentesRepository.loadAgentes().then((data) => listAgentes = data);
          print(listAgentes);
          emit(AgentesLoaded(listAgentes));
         on NetworkError 
          emit(AgentesError('Ocorreu algo inesperado, tente novamente mais tarde'));
        
      
    
    
    class NetworkError 

我的状态

part of 'agentes_cubit.dart';

@immutable
abstract class AgentesState 
  const AgentesState();


class AgentesInitial extends AgentesState 
  const AgentesInitial();


class AgentesLoading extends AgentesState 
  const AgentesLoading();


class AgentesLoaded extends AgentesState 
  final List<Agentes> agentes;
  const AgentesLoaded(this.agentes);

  @override
  bool operator ==(Object o) 
    if (identical(this, o)) return true;
    return o is AgentesLoaded && o.agentes == agentes;
  

  @override
  int get hashCode => agentes.hashCode;


class AgentesError extends AgentesState 
  final String message;
  const AgentesError(this.message);

  @override
  bool operator ==(Object o) 
    if (identical(this, o)) return true;

    return o is AgentesError && o.message == message;
  

  @override
  int get hashCode => message.hashCode;

我的页面

class AgentesPage extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return Scaffold(
      body: Container(
          child: BlocBuilder<AgentesCubit, AgentesState>(
        cubit: AgentesCubit(),
        builder: (context, state) 
          if (state is AgentesInitial) 
            print('initial');
            return buildLoading();
           else if (state is AgentesLoading) 
            print('loading');
            return buildLoading();
           else if (state is AgentesLoaded) 
            print('loaded');
            return buildAgentesList(state.agentes, context);
          
          return Container();
        ,
      )),
    );
  

  buildLoading() 
    return Center(
      child: CircularProgressIndicator(),
    );
  

  buildAgentesList(agentes, context) 
    print(agentes);
    return Container(
      width: MediaQuery.of(context).size.width,
      child: ListView.builder(
          itemCount: agentes.length,
          itemBuilder: (context, index) => CustomAgenteItem(agentes[index])),
    );
  

  void loadAgentes(BuildContext context) 
    final agentesCubit = context.bloc<AgentesCubit>();
    agentesCubit.getAgentes();
  

我的代理项目小部件

class CustomAgenteItem extends StatelessWidget 
  final Agentes agente;
  CustomAgenteItem(this.agente);

  @override
  Widget build(BuildContext context) 
    return InkWell(
        highlightColor: mainColor,
        splashColor: mainColor,
        onTap: () => print(''),
        child: Container(
          width: MediaQuery.of(context).size.width,
          child: new ParallaxImage(
            child: Padding(
              padding: const EdgeInsets.only(top: 16.0, left: 16),
              child: Text(
                agente.nome,
                style: listAgents,
              ),
            ),
            extent: 100.0,
            image: new AssetImage(
              'assets/images/bg.jpg',
            ),
          ),
        ));
  

我的存储库

class AgentesRepository 
  loadAgentes() async 
    return agentesFromJson(
        await rootBundle.loadString('assets/infos/agentes.json'));
  

【问题讨论】:

长镜头,我可以看到你没有在等待 MyCUBIT 中的 api 调用。这可能会导致问题。 【参考方案1】:

看起来你需要await_agentesRepository.loadAgentes()的结果,因为它是一个异步函数,否则代码块将继续运行下一行代码。您还可以将该行之后的所有代码移动到您传递给.then 的函数中,但它也不会读取。

此外,您似乎不需要在 AgentesCubit 类上定义 listAgentes

...
var data = await _agentesRepository.loadAgentes();
emit(AgentesLoaded(data));
...

【讨论】:

以上是关于Flutter Cubit 状态不离开起点(MyInitialState)的主要内容,如果未能解决你的问题,请参考以下文章

使用 Bloc/Cubit 进行 Flutter 状态管理

Flutter:单元测试一个 Cubit 问题

如何保持我的bottomNavigationBar Cubit BLoc Flutter的状态?

Flutter - Cubit 和一些需要澄清

Flutter BLoC/Cubit STATE 类最佳实践

Flutter - cubit - 改变cubit内的布尔值