javascript - ReactJS send key(index) on click - Stack Overflow

admin管理员组

文章数量:1297042

I want to send element's index on click in function. Because I should change data for every element and get it from array.

How can I get key in MainBlock from List? Is it possible? Or I do something wrong?

I'm very new in React and do many mistakes.

var MainBlock = React.createClass({
Click: function() {
    // I need to get element KEY
    // var data = array[key]
},
render: function() {
    return (
        <List Click={this.props.Click.bind(null, this)}>
    );
}
});

var List = React.createClass({
    render: function() {
        var ItemNodes = this.props.data.map(function(step, index) {
            return (
                <Item className="class" Click={this.props.Click.bind(null, this)} key={index} />
            );
        }.bind(this));
        return (
            <ul>
                {ItemNodes}
            </ul>
        );
    }
});

var StepWindow = React.createClass({
    render: function() {
        return (
            <li onClick={this.props.Click}>
                yo!
            </li>
        );
    }
});

Thank you for your help.

I want to send element's index on click in function. Because I should change data for every element and get it from array.

How can I get key in MainBlock from List? Is it possible? Or I do something wrong?

I'm very new in React and do many mistakes.

var MainBlock = React.createClass({
Click: function() {
    // I need to get element KEY
    // var data = array[key]
},
render: function() {
    return (
        <List Click={this.props.Click.bind(null, this)}>
    );
}
});

var List = React.createClass({
    render: function() {
        var ItemNodes = this.props.data.map(function(step, index) {
            return (
                <Item className="class" Click={this.props.Click.bind(null, this)} key={index} />
            );
        }.bind(this));
        return (
            <ul>
                {ItemNodes}
            </ul>
        );
    }
});

var StepWindow = React.createClass({
    render: function() {
        return (
            <li onClick={this.props.Click}>
                yo!
            </li>
        );
    }
});

Thank you for your help.

• javascript
• reactjs

Share Follow edited Feb 6, 2015 at 3:27 AndryName asked Feb 6, 2015 at 3:13 AndryNameAndryName 65222 gold badges77 silver badges1212 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

Try this:

Click={this.props.Click.bind(this, index)}

Click: function(idx, e){

}

check out the boundClick in the docs example http://facebook.github.io/react/tips/expose-ponent-functions.html

edit I've edited this to show that the parameters passed to the Click function are in the different order. It was e, idx and should be idx, e.

本文标签： javascriptReactJS send key(index) on clickStack Overflow