Bootstrap button onClick no defined in react

react
1

I am using twbs:bootstrap@=4.0.0-alpha2 with react. I tried to call a child button component from its parent

parent:

<StandardBtn type="button" className="btn btn-success-outline pull-right" onClick={()=>{console.log("hello2")}} text={"Register"}/>

child:

export default class StandardBtn extends Component { render() { let props=this.props; return ( <button type={props.type} className={props.className} onClick={()={props.onClick}}> {props.text} </button> ) } }

When I clicked on the button, the console show: Uncaught ReferenceError: onClick is not defined

However, if i do the same thing( define the button and its onClick callback) on the parent level, there is not err.

I’ve also tied to bind env to callback in the child, but it has the same error

Any help is appreciated

2

hmmm… what happens if you rename your props to something other than onClick?

3

Thanks,but it doesn’t work, I tried that at the very beginning

4

Could it be this typo? Probably what you want is just onClick={props.onClick}, or onClick={()=>{props.onClick()}. But the first one is definitely better.

1 Like
5

Thanks Sashko, it wasn’t a typo problem. It was because I renamed my folder and my ide didn’t update the folder name. So I kept messing the code, instead of checking the correct directory. :frowning: