在React中状态改变后，div onClick函数触发

Question

我遇到一个问题，即在React应用程序中更改状态后调用函数。

我已经看过这里提供的其他解决方案，但它仍然不适合我。也许是因为我的点击是在div而不在输入上。

任何建议都将不胜感激！

有问题的函数是handleClick函数。当我在Video Deck上触发状态更改时，会调用该函数，我绝对不希望这种情况发生。

代码：

＆＃13;

＆＃13;

import React from 'react'
import {connect} from 'react-redux'

// COMPONENTS
import VideoDeck from './deck/videoDeck'
import VideoPlayer from './video/videoPlayer'

class Main extends React.Component {
  constructor (props, context) {
    super (props, context)

    this.handleClick = this.handleClick.bind(this)
  }

  handleClick () {
    console.log('click')
  }

  render () {
    return (
      <div id="main" className="cls-main" onClick={() => {this.handleClick()}}>
        <div id="player-overlay" className="cls-player-overlay">
          <br />
        </div>
        <VideoPlayer />
        <VideoDeck />
      </div>

    )
  }
}

export default connect(
  (state) => {
    return state;
  }
)(Main)

＆＃13;

＆＃13;

＆＃13;