flutter_bloc中BlocSelector有什么用

Question

没有找到BlocSelector的使用示例。有人知道它的真正用途吗？

Answer 1

使用此小部件，开发人员可以根据区块的当前状态过滤更新。

我有一个数字反例的解决方案，也许对我们有帮助

这是我的main.dart文件

import 'package:flutter/material.dart';
import 'package:untitled/counter_cubit.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

void main() => runApp(const App());

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MultiBlocProvider(
        providers: [
          BlocProvider<CounterCubit>(
            create: (BuildContext context) => CounterCubit(),
          ),
        ],
        child: const BlocListenerCounterPage(),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Counter')),
      body: BlocSelector<CounterCubit, int, bool>(
        selector: (state) => state.isEven ? true : false,
        builder: (context, booleanState) {
          return Center(
              child: booleanState
                  ? Text('$booleanState')
                  : Icon(Icons.integration_instructions));
        },
      ),
      floatingActionButton: Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        mainAxisAlignment: MainAxisAlignment.end,
        children: <Widget>[
          FloatingActionButton(
            child: const Icon(Icons.add),
            onPressed: () => context.read<CounterCubit>().increment(),
          ),
          const SizedBox(height: 4),
          FloatingActionButton(
            child: const Icon(Icons.remove),
            onPressed: () => context.read<CounterCubit>().decrement(),
          ),
        ],
      ),
    );
  }
}

它是我的counter_cubit.dart (viewModel) 类

import 'package:flutter_bloc/flutter_bloc.dart';

class CounterCubit extends Cubit<int> {
  CounterCubit() : super(0);

  void increment() => emit(state + 1);
  void decrement() => emit(state - 1);
}

基本上这个例子，当数字是偶数时我显示文本小部件，当数字不是偶数时我显示图标小部件。

Answer 2

BlocSelector<AuthViewModel, BaseEntityState, bool>(
    selector: (state) => state.user.isAuthenticated,
    builder: ((context, isAuthenticated) {
        return FloatingActionButton( 
            onPressed: doSomething,
            child: isAuthenticated
                ? Icon(Icons.logout_outlined)
                : Icon(Icons.login_outlined),
          );
   }