Passing a parameter using React

Question

I have this Json variable:

this.state = {
            groups: [{
                name: '',
                permission: [{
                    name: ''
                }]
            }]
        }

And on my render method i have this:

 render() {

        return (
            <div>
                <div>
                    <HeaderApp />

                    <h3>Choose a group to add permissions:</h3>

                    {this.state.groups.map((groups) => {
                        return (<li key={groups.code}>
                            <Card>
                                <CardBody>
                                    <CardTitle>{groups.name}</CardTitle>
                                    <CardSubtitle>This group has {this.countPermissionPerGroup(groups)} permissions.</CardSubtitle> 
                                    <Button color="secondary" onClick={(groups) => this.onClickShowPermissions(groups)}>Show permissions</Button>    
                                    <Button color="secondary">Add Permission</Button>
                                </CardBody>
                            </Card>
                        </li>)

                    })}


                </div>
            </div>
        );
    }

On the onClick method i want to pass the group where the button belongs and get all the permissions of that same group and print it on my console with this method:

onClickShowPermissions = (group) => {
    for(var g in group.permission){
        console.log("Test"+g)
    }

}

But for some reason that doesnt work,what am i doing wrong?

Taavi Kivimaa · Accepted Answer · 2019-03-15 23:51:40Z

1

The onClick action has event type binded to it. So instead of trying to pass groups directly from onClick, leave it empty , like this:

<Button color="secondary" onClick={() => this.onClickShowPermissions(groups)}>Show permissions</Button>

answered Mar 15, 2019 at 23:51

Taavi Kivimaa

2521 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

jose azevedo Over a year ago

just one more question, it is possible to open a popup when that method is executed'

Taavi Kivimaa Over a year ago

Sure, you can either put it at the end of onClickShowPermission method like window.alert("I'm done"); or make your onClick a little more complex, but try first option.

Collectives™ on Stack Overflow

Passing a parameter using React

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related