Trong bài viết này, chúng ta sẽ tìm hiểu về Class Component trong ReactJS - một khái niệm quan trọng mà mọi lập trình viên ReactJS cần biết.
Trong ReactJS, Class Component là một cách để định nghĩa một component. Nó được tạo ra bằng cách kế thừa từ lớp React.Component
.
Một Class Component bao gồm ít nhất một phương thức, đó là render()
. Phương thức này trả về một phần tử React, thường là JSX, mô tả nội dung mà component này sẽ hiển thị trên giao diện.
class MyComponent extends React.Component {
render() {
return <h1>Hello, world!</h1>;
}
}
Trong đoạn mã trên, MyComponent
là một Class Component. Nó kế thừa từ React.Component
và định nghĩa phương thức render()
, trả về một phần tử JSX.
Class Component cho phép chúng ta sử dụng các tính năng của JavaScript ES6 như constructor
, state
, và các phương thức vòng đời của component (lifecycle methods
).
Ví dụ về việc sử dụng state
trong Class Component:
class MyComponent extends React.Component {
constructor(props) {
super(props);
this.state = { count: 0 };
}
render() {
return <h1>{this.state.count}</h1>;
}
}
Trong đoạn mã trên, MyComponent
có một state
với thuộc tính count
. Giá trị của count
sẽ được hiển thị trên giao diện.
Class Component là một phần quan trọng của ReactJS, giúp chúng ta tạo ra các component phức tạp hơn với state
và các phương thức vòng đời. Hy vọng qua bài viết này, bạn đã hiểu rõ hơn về Class Component trong ReactJS.