如何在 Flutter 中将事件从一个有状态小部件广播到另一个小部件

Question

我想将一个事件从一个有状态小部件广播到另一个，但似乎无法找到一种方法。 我安装了这个插件： event: ^1.1.4 但它没有触发。 我想要像下面这样的东西：

Stateful Widget 1:
SomeEventClass.broadcastEvent();

Stateful Widget 2:
SomeEventClass.subscribe();

Answer 1

通过使用这样的东西。

class ContinuousStream {
  _DataStore _mStorage = _DataStore.getInstance();

  /// Sets a new value [value] to the data stream [stream].
  /// If there are active subscribers, the value will be dispatched to them.
  void emit(String stream, var value) {
    _mStorage?.setValue(stream, value);
  }

  /// Subscribes to the given stream [stream].
  /// If stream already has data set, it will be delivered to the [callback] function.
  void on(String stream, void Function(Object) callback) {
    _mStorage?.setCallback(stream, callback);
  }

  /// Returns the current value of a given data [stream].
  Object getValue(String stream) {
    return _mStorage?.getValue(stream);
  }
}

// Storage class for ContinuousStream.
class _DataStore {
  // Singleton Instance for DataStore
  static _DataStore _instance;

  // Map instance to store data values with data stream.
  HashMap<String, _DataItem> _mDataItemsMap = HashMap();

  // Sets/Adds the new value to the given key.
  void setValue(String key, var value) {
    // Retrieve existing data item from map.
    _DataItem item = _mDataItemsMap[key];

    item ??= _DataItem();

    // Set new value to new/existing item.
    item.value = value;

    // Reset item to the map.
    _mDataItemsMap[key] = item;

    // Dispatch new value to all callbacks.
    item.callbacks?.forEach((callback) {
      callback(value);
    });
  }

  // Sets/Adds the new callback to the given data stream.
  void setCallback(String key, Function(Object) callback) {
    if (callback != null) {
      // Retrieve existing data item from the map.
      _DataItem item = _mDataItemsMap[key];

      item ??= _DataItem();

      // Retrieve callback functions from data item.
      List<Function(Object)> callbacks = item.callbacks;

      // Check if callback functions exists or not.
      if (callbacks == null) {
        // If it's null then create new List.
        callbacks = List();

        // Set callback functions list to data item.
        item.callbacks = callbacks;

        // Set the data item to the map.
        _mDataItemsMap[key] = item;
      }

      // Add the given callback into List of callback functions.
      callbacks.add(callback);

      // Dispatch value to the callback function if value already exists.
      if (item.value != null) {
        callback(item.value);
      }
    }
  }

  // Returns current value of the data stream.
  Object getValue(String key) {
    return _mDataItemsMap[key].value;
  }

  // Returns singleton instance of _DataStore
  static _DataStore getInstance() {
    _instance ??= _DataStore();
    return _instance;
  }
}

// Data class to hold value and callback functions of a data stream.
class _DataItem {
  var value;
  List<Function(Object)> callbacks;
}

一旦创建了这个类，您就可以初始化和访问流。 例如，这需要在 StateFulWidget 1 和 StateFUlWidget 2 中完成。

ContinuousStream continuousStream = new ContinuousStream();

然后从 StateFulWidget1：

void send() {
      String message = "Hello";
      continuousStream.emit("chat-message", message);
  }

这对应于您的广播事件。

来自 StatefulWidget2：

continuousStream.on("chat-message", (message) {
      print("Message Received: $message");
    });

这对应于您的订阅事件。 这应该可以解决您的问题。