Easy Tutorial
❮ Android Tutorial Canvas Api2 Localstorage Spec ❯

React Click Event's bind(this) Parameter Passing Issue

Category Programming Techniques

This article will introduce how to pass parameters in React's click event.

Problem Description

Let's first look at the description of the problem. See the figure below:

So how do I solve this problem?

The following is the HTML code, clickFunction is the click event function, thisStatus is the parameter to be passed:

&lt;div onClick={this.clickFunction.bind(this, thisStatus)}>Close</div>

The following is the way the React function receives parameters, thisStatus function accepts the parameter:

clickFunction(thisStatus, event) {
    console.log('thisStatus', thisStatus);
}

To solve the problem I raised at the beginning, also, see the picture.

That's it.

Summary

Parameters need to be bound through the bind method, the first parameter points to this, and the second parameter is the parameters received by the event function:

<button onClick={this.handleClick.bind(this, props0, props1, ...)}></button>

handleClick(props0, props1, ..., event) {
    // your code here
}

>

Original article: https://blog.csdn.net/genius_yym/article/details/54135567

** Share My Notes

Cancel

-

-

-

❮ Android Tutorial Canvas Api2 Localstorage Spec ❯