[React] Public Class Fields with React Components
2024-08-31 08:08:58
Public Class Fields allow you to add instance properties to the class definition with the assignment operator (=). In this lesson, we'll look at their use case for simplifying event callbacks and state initialization with a React component.
Handle function:
// Better
handleClick = () => {
...
} // Not good
constructor() {
super();
this.handleClick = this.handleClick.bind(this);
} handleClick() {
...
}
Handle State:
// Better
state = {count: } // Not good
constructor() {
super();
this.state = {count: };
}
Using puiblic field, we can actually remove 'constructor' because it is no longer necessary.
class App extends React.Component {
state = {clicks: }
handleClick = () => {
this.setState(prevState => {
return {clicks: prevState.clicks + }
})
}
render() {
return (
<div>
<div>
Click Count: {this.state.clicks}
</div>
<button
onClick={this.handleClick}
>
Click Me!
</button>
</div>
)
}
}
ReactDOM.render(
<App />,
document.getElementById('root')
)
最新文章
- 高性能MySQL（三）：服务器性能剖析
- 图——拓扑排序（uva10305）
- linux下ftp配置文件详解
- 下载Orchard源码
- css控制页面打印（分页、屏蔽不需要打印的对象）
- MySQL并发调优和IO调优
- 【转】将 azw3 格式转换为 mobi 格式并保持原有排版格式
- PHP几个几十个G大文件数据统计并且排序处理
- android隐式intent使用场景解析
- transition的唧唧歪歪
- OpenCV2第一个马拉松8环——画一个柱状图
- JS基础，你需要掌握的要点！
- NOIP 11.01 应试记录
- JVM基础系列第8讲：JVM 垃圾回收机制
- 通过go-ethereum源码看如何管理项目
- vue-cli（vue脚手架） 简单使用
- im4java+GraphicsMagick 的问题
- 使用 EF Core 的 EnableRetryOnFailure 解决短暂的数据库连接失败问题
- Spring Boot初识（4）- Spring Boot整合JWT
- iconfont 入门级使用方法