小编Phi*_*ume的帖子

我使用 go_router 进行导航，使用 flutter_bloc 进行状态管理。

我想使用refreshListenable并在我的GoRouter配置中监听我的AuthBloC事件，但是，我无权访问我的GoRouter中的上下文，并且我不想提供它。

我发现的大多数答案都已过时，或者使用 StreamBuilder 等替代方案在事件更改时重新渲染整个应用程序，这并不理想。

如何在上下文之外监听我的 AuthEvents？

主程序.dart

return RepositoryProvider.value(
      value: authRepo,
      child: BlocProvider(
        create: (_) => AuthBloc(authRepo),
        child: MaterialApp.router(
          ...
          routerConfig: Routes.router,
          builder: (_, child) {
            final isRTL = LocaleSettings.currentLocale == AppLocale.ar;

            return Directionality(
              textDirection: isRTL ? TextDirection.rtl : TextDirection.ltr,
              child: child!,
            );
          },
        ),
      ),

块/auth/auth_bloc.dart

class AuthBloc extends Bloc<AuthEvent, AuthState> {
  AuthBloc(this._authenticationRepository) : super(const AuthState()) {
    on<AuthEvent>((event, emit) {
      event.when(
        authStateChangeEvent: (account) => _authStateChangeEvent(account, emit),
        signOutEvent: _signOutEvent,
        verifyAccount: _verifyAccount,
      );
    });
    _userSubscription = …

我目前正在努力应对反应输入并从 lodash 中去抖动。大多数情况下，当我有一个表单时，我也有一个编辑选项，所以我需要一个受控组件来填充输入，value={state["targetValue"]}以便我可以填充和编辑该字段。

但是，如果组件受到控制，则 debounce 不起作用。我在 CodeSandbox 上做了一个简单的例子：https ://codesandbox.io/embed/icy-cloud-ydzj2 ? fontsize =14& hidenavigation =1& theme = dark

代码：

import React, { Component } from "react";
import ReactDOM from "react-dom";
import { debounce } from "lodash";

import "./styles.css";

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      name: "",
      title: "",
      editMode: false
    };
    this.debouncedEvent = React.createRef();
  }

  debounceEvent(_fn, timer = 500, options = null) {
    this.debouncedEvent.current = debounce(_fn, timer, options);
    return e => {
      e.persist(); …