在事件处理程序中使用props

时间:2017-12-05 15:08:53

标签: reactjs event-handling react-props

我试图在事件处理程序中使用props。这是我的代码的一部分

class Dashboard extends Component {
  componentDidMount() {
    var grid = new Muuri('.grid', {
      //options...
    });
    grid.on('move', (data) => {
      console.log('ok')
      //can't use this.props here
    );
  }
  render() {...}
  constructor() {...}
}

问题是我无法在“移动”内访问this.props。处理程序。

1 个答案:

答案 0 :(得分:2)

您可以存储this.props的引用并在事件处理程序中引用它。

或者 使用析构函数访问所需的单个属性,然后在事件处理程序中访问这些属性。

class Dashboard extends Component {
    componentDidMount() {

        const {prop1name, prop2Name} = this.props;

        //OR

        const thisProps = this.props;




        var grid = new Muuri('.grid', {
            //options...
        });
        grid.on('move', (data) => {
            console.log('ok')
            //access `this.props` using `thisProps` or access individual properties.
            )}
        render() {}
        constructor() {}
    }