- React事件绑定和原生DOM事件绑定相似
- 语法:on+事件名={事件处理程序} 例如:onClick={()=>{}}
- 注意:React事件采用驼峰命名法
类组件事件绑定
import React from 'react';
import ReactDOM from 'react-dom';
class App extends React.Component {
handleClick() {
console.log(111);
}
render() {
return (<button onClick={this.handleClick} > 点我</button >)
}
}
ReactDOM.render(<App />, document.getElementById('root'))
函数组件事件绑定
import React from 'react';
import ReactDOM from 'react-dom';
function App() {
function handleClick() {
console.log(111);
}
// 函数组件内没有this,所以直接写函数名,不需要加 this.
return (<button onClick={handleClick}>点我</button>)
}
ReactDOM.render(<App />, document.getElementById('root'))
总结
本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注靠谱客的更多内容!
最后
以上就是优秀烤鸡最近收集整理的关于React事件绑定详解的全部内容,更多相关React事件绑定详解内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复