فیلم های آموزشی ReactJS
State یا حالت مکانی است که داده ها از آن سرچشمه می گیرند. همواره بهتر است تا حد امکان حالت خود را ساده در نظر بگیریم و تعداد اجزای حالت دار را به حداقل برسانیم. مثلا اگر ده جزء داشته باشیم که داده هایی را از حالتی نیاز دارند، بهتر است یک جزء نگهدارنده را ایجاد کنیم که این حالت را برای تمامی این اجزا نگهداری کند.
استفاده از Props در ReactJS
در نمونه کد زیر چگونگی ایجاد یک جزء حالت دار با استفاده از سینتکس 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'));
این کار باعث می شود نتیجه ی زیر نمایش داده شود.
برای مطالعه سرفصل دوره آموزش عملی و کاربردی ReactJS کلیک نمایید .