ReactJS - State
State là nơi bắt nguồn của dữ liệu. Chúng ta nên luôn cố gắng làm cho trạng thái của mình đơn giản nhất có thể và giảm thiểu số lượng các thành phần trạng thái. Ví dụ: nếu chúng ta có mười thành phần cần dữ liệu từ trạng thái, chúng ta nên tạo một thành phần chứa sẽ giữ trạng thái cho tất cả chúng.
Sử dụng State
Đoạn mã mẫu sau đây cho thấy cách tạo một thành phần trạng thái bằng cú pháp EcmaScript2016.
App.jsx
import React from 'react';
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
header: "Header from state...",
content: "Content from state..."
}
}
render() {
return (
<div>
<h1>{this.state.header}</h1>
<h2>{this.state.content}</h2>
</div>
);
}
}
export default App;
main.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.jsx';
ReactDOM.render(<App />, document.getElementById('app'));
Điều này sẽ tạo ra kết quả sau.
Bài viết nổi bật
Bài viết nổi bật