Question

我刚开始使用NodeJS和ReactJS。我不太清楚某些事情。

render( ) {
return (
  <div>
    <img src={this.props.pic}
         onclick={this.props.cb()}
         class="af1" />
  </div>
 );
}

以上是我App组件的渲染方法。我想在第一次点击图片后删除onClick属性并禁用图片（not able to click again）10秒钟左右（如果有更好的方法可以暂时禁用点击图片，请建议我）。这会是一个很好的解决方案吗？

为什么我不能在chrome的开发者控制台中看到onclick attrib？我真的开始喜欢学习这些东西，我在某个地方迷路了。

Answer 1

class App extend React.Component{
    constructor(props){
        super(props);
        this.onImageClick = this.onImageClick.bind(this);
        this.timeDelay= this.timeDelay.bind(this);
    }

    onImageClick(...args){
        // do something
    }

    timeDelay(func, delay){
        var isCalled = false;
        return (args)=>{
           if (!isCalled){
               isCalled = true;
               func(event);
               setTimeout(()=>{
                  isCalled = false;
               }, delay)
           }
        }
    }

    componentWillMount(){
        this.onImageClickWithTimeDelay = this.timeDelay(this.onImageClick, 10000);
    }

    render(){
        return <div>
            <img src={this.props.pic} onClick={ this.onImageClickWithTimeDelay }/>
        </div>
    }
}

我希望这对你有用。

如何从ReactJS组件中删除“onClick”属性？

1 个答案: