クイック・ルック
5719 ワード
何がUSENTですか?
USENTは反応フックです.反応フックは、16.8に反応する新機能です.フックは、機能的なコンポーネントの内部、状態のようなものを使うのを許します.
それで、通常、クラス構成要素のために若干の状態を作るとき、それはこのように見えます
class FakeDate extends React.Component {
constructor(props) {
super(props);
this.state = {counter: 0};
this.handleClick = this.handleClick.bind(this);
}
handleClick = () => {
this.setState({counter: counter++})
}
render() {
return (
<div>
<button onClick={this.onClick}>click to change counter</button>
</div>
<h2>It is {this.state.date}.</h2>)
}
}
今フックで、我々はUSENTを利用し、このようなものを書くことができますconst Counter = () => {
const [counter, setCounter] = useState(0)
const onClick = () => {
setCounter(counter++)
}
return (
<div>
<button onClick={onClick}>
click me to change counter
</button>
<h1>{counter}</h1>
</div>
)
}
かなりクールな右?より深い観察
私たちがUSENTのとき、コンストラクタまたは状態オブジェクトをもはや必要としません.代わりに、setvariableパートナーと一緒に状態変数を宣言します.ここで、いつでも、特定の状態変数を更新したいだけで、setvariableを呼び出して値を渡します.
USENTは、より良い州ですか?
あなたはUSENTフックまたは伝統的な状態ライフサイクルを使用する必要がありますか?
さて、関数やクラスのコンポーネントを使用する場合によって異なります.
USENTは単に便宜のツールです.
クラスコンポーネントが機能的コンポーネントより有用な場合もあります.あなたのニーズを評価し、答えは明らかになります.
結論
我々は、USEstateフックを越えました.私は、あなたがこれから若干の知識を得たことを望みます.あなたが質問をするならば、私のものに手を差し伸べる自由に感じてください.
読んで、ありがとうとコーディングをありがとう!
Reference
この問題について(クイック・ルック), 我々は、より多くの情報をここで見つけました https://dev.to/kevsmss/a-quick-look-at-reacts-usestate-1oamテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol