javascript - Reactjs 的 EventManager 抛出 "addHandler is not a function"

Question

我正在尝试使用 Reactjs 设置 UI，但是收到一条错误消息，指出 addHandler 和 removeHandler 不是函数 .

以下代码位于名为 bridge.js 的文件中

// Global variable for describe on events from react components
var EventManager = {
  events: {},

  addHandler: function(eventName, handler) {
    if (eventName in this.events) {
      this.events[eventName].push(handler);
    } else {
      this.events[eventName] = [handler];
    }
  },

  removeHandler: function(eventName, handler) {
    if (eventName in this.events) {
      var index = this.events[eventName].indexOf(handler);
      this.events[eventName].splice(index, 1);
    }
  }
};

// Handle events from client
function trigger(eventName, args) {
  var handlers = EventManager.events[eventName];
  handlers.forEach(handler => handler(JSON.parse(args)));
}

module.exports = { trigger: trigger };

在这里，我尝试利用 EventManager 来监听事件名称为 updateCharacterInfo 的 trigger，但它会抛出异常。

import React, { Component } from "react";
import EventManager from "../bridge";

class Leftbar extends Component {
  state = {
    status: "",
    firstname: "",
    {...}

  };

  componentDidMount() {
    EventManager.addHandler(
      "updateCharacterInfo",
      this.updateCharacterInfo.bind(this)
    );
  }

  componentWillUnmount() {
    EventManager.removeHandler("updateCharacterInfo", this.updateCharacterInfo);
  }

Answer 1

根据评论中的信息，您似乎正在执行命名导出，然后执行默认导入。您需要使用命名导入来匹配导出，方法是将名称括在大括号中:

import { EventManager } from "../bridge"