class Application extends React.Component {
render() {
return [div]
[button onclick={() => {console.log('click'}}]button[/button]
[/div];
}
}
React.render(<Application />, document.getElementById('app'));
I have the above code in my react app, render component. Nothing happens as nothing print in console.
React uses camelCase. onclick should be onClick.
<button onClick={() =>{console.log('clicked')}}>button</button>
It's just that you have made a syntax mistake here. React uses camelCase for event handlers.
For example, the HTML:
<button onclick="activateLasers()">
Activate Lasers
</button>
is slightly different in React:
<button onClick={activateLasers}>
Activate Lasers
</button>
So your code becomes:
class Application extends React.Component {
render() {
return (
<div>
<button onClick={() => {console.log('click'}}]button </button>
</div>
)
}
}
React.render(<Application />, document.getElementById('app'));
<button onClick={() => {console.log('clicked')}}> button </button>prettier?<and>getting converted to[and].