DeviceEventEmitter 它已经监听了两次

Question

我不知道为什么当我触发DeviceEventEmitter.addListener事件时，它已发出一次但侦听两次。

我有一个组件基础，它已添加到每个屏幕中，例如

<View>
    {this.props.children}
    <ModalComponent />
</View>

ModalComponent应该能够在触发ModalVisible 事件的任何时候打开。

  constructor (props) {
    super(props)
    this.state = {
      modalVisible: false
    }
  }

  componentDidMount() {
    DeviceEventEmitter.addListener('ModalVisible', this.onModalVisible)
  }

  componentWillUnmount () {
    DeviceEventEmitter.removeListener('ModalVisible', this.onModalVisible)
  }

  onModalVisible = (args) => {
    console.log(['ModalVisible', args]) // logging twice
    this.setState({
      modalVisible: args.visible
    })
  }

  close () {
    this.setState({
      modalVisible: false
    })
  }

  onRequestClose = () => {
    this.close()
  }

  render() {
    return (
      <Modal animationType={'slide'} transparent={false} visible={this.state.modalVisible} onRequestClose={this.onRequestClose}>
        ...
      </Modal>
    )
  }

我有一个服务器，可以在需要时发出事件

  static show (data) {
    console.log(['Service.show', data]) // only once
    DeviceEventEmitter.emit('ModalVisible', { visible: true })
  }

当 Service.show 被调用时，第一个日志仅出现一次，但在addListener处它立即被记录了两次。

我已经尝试过了

this.listener = DeviceEventEmitter.addListener(...)
this.listener.remove()

和

this.onModalVisible.bind(this)

但它给了我同样的问题。

除此之外，在同一时刻模态它被复制，当我关闭时，我有两个模态要关闭。

我还尝试在没有父组件的情况下在新屏幕中加载所有这些内容，看看这是否是问题所在，答案是否定的。它仍然。

Answer 1

我在使用 socket.io 两次触发/注册事件时遇到了同样的问题，我的问题是由于我在 DidMount 方法上添加了 eventListeners。但由于我的组件被安装了多个，它也多次添加事件监听器。

我的猜测是您多次使用相同的组件，因此多次添加相同的事件监听器。尝试将您的 eventsListener 添加到另一个仅被调用一次的位置。