Question

我在React应用程序中使用外部JavaScript库。

该库调度事件，并为这些事件添加了适当的侦听器。我现在正试图从事件处理程序内部访问React道具。是否可以访问这些？

我显然不能使用＆＃39;这个＆＃39;因为上下文已从事件处理程序内部切换到文档。

import React, { Component } from "react";
import config from 'react-global-configuration';

export default class Meeting extends Component {
  constructor(props) {
    super(props);
    console.log(this.props);

  }
  componentDidMount() {

  document.addEventListener('onLocalMediaElementAdded', function (e) {
      console.log('event fired');
      //I NEED TO ACCESS PROPS HERE
    }, false);
  }

  render() {
    return (
      <div id="meeting">
        <div id="container"></div>
      </div>
    );
  }
}

Answer 1

您可以使用箭头功能来维持范围。

所以

document.addEventListener('onLocalMediaElementAdded', (e) => {
  console.log('event fired');
  //I NEED TO ACCESS PROPS HERE
  console.log(this.props); // it works now
}, false);

从javascript事件侦听器内部反应访问道具

1 个答案: