成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

React Hooks系列之useState

SimonMa / 3145人閱讀

摘要:在出現(xiàn)之前,組件添加,只能在中完成。方式之后,可以在組件中創(chuàng)建了,不用再每次都需要創(chuàng)建一個,更加函數(shù)式了。展示了如何初始化表單數(shù)據(jù),和更新對應的字段

在React Hooks出現(xiàn)之前,組件添加state, 只能在class中完成。

class方式

React 16.7 alpha之后,可以在function組件中創(chuàng)建state了,不用再每次都需要創(chuàng)建一個class component,更加函數(shù)式了。

useState方式

不同場景下,應該如何使用useState

場景1:隱藏/顯示一個組件

場景2:根據(jù)上一個state更新state

setSteps方法中第一個參數(shù)是prevState

場景3:state是一個數(shù)組值

場景4:state是一個對象

下邊是一個表單,表單中有username, password兩個字段。展示了如何初始化表單數(shù)據(jù),和更新對應的字段

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/103523.html

相關文章

  • 快速了解 React Hooks 原理

    摘要:使用該對象,可以跟蹤屬于組件的各種元數(shù)據(jù)位。調(diào)用你的組件這意味著它知道存儲的元數(shù)據(jù)對象。下一次渲染會發(fā)生什么需要重新渲染組件由于之前已經(jīng)看過這個組件,它已經(jīng)有了元數(shù)據(jù)關聯(lián)。 為了保證的可讀性,本文采用意譯而非直譯。 想閱讀更多優(yōu)質(zhì)文章請猛戳GitHub博客,一年百來篇優(yōu)質(zhì)文章等著你! 我們大部分 React 類組件可以保存狀態(tài),而函數(shù)組件不能? 并且類組件具有生命周期,而函數(shù)組件卻不能...

    Hydrogen 評論0 收藏0
  • react hooks 全面轉(zhuǎn)換攻略(一) react本篇useState,useEffect

    摘要:經(jīng)典案例此例子中是最新的語法其中是他的值是用來設置值的函數(shù)是初始值該初始值可以接受任何參數(shù)但是記得當他接受為一個函數(shù)時就變成了延遲初始化該函數(shù)返回值即為這兩種初始化方式是相等的但是在函數(shù)為初始值時會被執(zhí)行一次這里只會在初始化的時候執(zhí)行中的 useState 經(jīng)典案例: import { useState } from react; function Example() { con...

    KnewOne 評論0 收藏0
  • 10分鐘了解 react 引入的 Hooks

    摘要:最近官方在大會上宣布內(nèi)測將引入。所以我們有必要了解,以及由此引發(fā)的疑問。在進一步了解之前,我們需要先快速的了解一些基本的的用法。如何解決狀態(tài)有關的邏輯的重用和共享問題。 showImg(https://segmentfault.com/img/remote/1460000016886798?w=1500&h=750); 大家好,我是谷阿莫,今天要將的是一個...,哈哈哈,看到這個題我就...

    Lucky_Boy 評論0 收藏0
  • React系列 --- 從Mixin到HOC再到HOOKS(四)

    摘要:返回元素的是將新的與原始元素的淺層合并后的結(jié)果。生命周期方法要如何對應到函數(shù)組件不需要構(gòu)造函數(shù)。除此之外,可以認為的設計在某些方面更加高效避免了需要的額外開支,像是創(chuàng)建類實例和在構(gòu)造函數(shù)中綁定事件處理器的成本。 React系列 React系列 --- 簡單模擬語法(一)React系列 --- Jsx, 合成事件與Refs(二)React系列 --- virtualdom diff算法實...

    Lionad-Morotar 評論0 收藏0
  • React手稿State Hooks of Hooks

    摘要:官方也陳述,接下來的的工作會投入到中。從目前官方的文檔可以看出,從以下四個方面來提高的編碼。生命周期自定義方法的主要用途是替代之前版本的組件。說明到目前為止,在已發(fā)布的版本中有該功能,想體驗該功能,必須安裝。 React Hooks React在16.7.0-alpha.0版本中提到了Hooks的概念,目前還是Proposal階段。 官方也陳述,接下來的90%的工作會投入到React ...

    DC_er 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<