国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

【全棧React】第3天: 我們的第一個(gè)組件

KaltZK / 1049人閱讀

摘要:我們的應(yīng)用由一個(gè)單一的元素組成。讓我們通過(guò)構(gòu)建我們的第一個(gè)組件來(lái)開始接觸這個(gè)力量。我們將把組件寫成類。讓我們來(lái)看一個(gè)我們要調(diào)用的組件。然而,什么都不會(huì)在屏幕上呈現(xiàn)。

本文轉(zhuǎn)載自:眾成翻譯
譯者:iOSDevLog
鏈接:http://www.zcfy.cc/article/3799
原文:https://www.fullstackreact.com/30-days-of-react/day-3/

這個(gè)系列的前兩篇文章是很重要的討論。在今天的課程中,我們來(lái)看看一些代碼,并寫下我們的第一個(gè)React應(yīng)用。

讓我們重溫第一天介紹的Hello world應(yīng)用。這次,略有不同:




  
  Hello world
  
  ``
  ``
  ``


  
``
加載React庫(kù)

我們?cè)诎薘eact的來(lái)源作為 `` ``

``

然而,什么都不會(huì)在屏幕上呈現(xiàn)。你還記得為什么嗎?

我們沒(méi)有告訴React我們要在屏幕上渲染任何東西,或者在什么地方渲染它。我們需要再次使用ReactDOM.render() 函數(shù)來(lái)表達(dá)React我們想要呈現(xiàn)的內(nèi)容和位置。

添加ReactDOM.render() 函數(shù)將在屏幕上呈現(xiàn)我們的應(yīng)用:

var mount = document.querySelector("#app");
ReactDOM.render(, mount);

請(qǐng)注意,我們可以使用App類來(lái)渲染我們的React應(yīng)用,就像它是一個(gè)內(nèi)置的DOM組件類型(像

標(biāo)簽一樣)。這里我們使用它,就像它是一個(gè)帶尖括號(hào)的元素:

我們的React組件的行為就像我們頁(yè)面上的任何其他元素一樣,我們可以像構(gòu)建一個(gè)本地瀏覽器樹一樣構(gòu)建一個(gè)組件樹。

雖然我們現(xiàn)在渲染一個(gè)React組件,我們的應(yīng)用仍然缺乏豐富性或交互性。很快,我們將看到如何使React組件數(shù)據(jù)驅(qū)動(dòng)和動(dòng)態(tài)。但首先,在本系列的下一期中,我們將探討如何對(duì)圖層組件進(jìn)行分層。嵌套組件是豐富的React Web應(yīng)用的基礎(chǔ)。

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

轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/84574.html

相關(guān)文章

  • 全棧ReactReact 30教程索引

    摘要:今天我們將討論創(chuàng)建組件的最終方案,即無(wú)狀態(tài)函數(shù)的純組件。今天我們正在研究一種處理提出的復(fù)雜數(shù)據(jù)的方法,稱為體系結(jié)構(gòu)。第天部署介紹今天,我們將探討部署我們的應(yīng)用所涉及的不同部分,以便外界可以使用我們的應(yīng)用。 本文轉(zhuǎn)載自:眾成翻譯譯者:iOSDevLog鏈接:http://www.zcfy.cc/article/3758原文:https://www.fullstackreact.com/3...

    appetizerio 評(píng)論0 收藏0
  • 全棧React4: 復(fù)雜組件

    摘要:本文轉(zhuǎn)載自眾成翻譯譯者鏈接原文太棒了,我們已經(jīng)構(gòu)建了第一個(gè)組件。天前一章節(jié),我們開始構(gòu)建我們的第一個(gè)組件。內(nèi)容部分內(nèi)有個(gè)不同的項(xiàng)目組件。決定劃分組件的深度比科學(xué)更顯得藝術(shù)。子組件當(dāng)組件嵌套在另一個(gè)組件中時(shí),它被稱為子組件。 本文轉(zhuǎn)載自:眾成翻譯譯者:iOSDevLog鏈接:http://www.zcfy.cc/article/3817原文:https://www.fullstackre...

    Mike617 評(píng)論0 收藏0
  • 全棧React1: 什么是 React?

    摘要:本文轉(zhuǎn)載自眾成翻譯譯者鏈接原文今天,我們從一開始就開始。讓我們看看是什么,是什么讓運(yùn)轉(zhuǎn)起來(lái)。什么是是一個(gè)用于構(gòu)建用戶界面的庫(kù)。它是應(yīng)用程序的視圖層。所有應(yīng)用程序的核心是組件。組件是可組合的。虛擬完全存在于內(nèi)存中,并且是網(wǎng)絡(luò)瀏覽器的的表示。 本文轉(zhuǎn)載自:眾成翻譯譯者:iOSDevLog鏈接:http://www.zcfy.cc/article/3765原文:https://www.ful...

    ralap 評(píng)論0 收藏0
  • 全棧React2: 什么是 JSX?

    摘要:代表基本上是常規(guī)。第次更新,在年完成。幾乎完全支持所有主要的瀏覽器。但這將是一段時(shí)間,直到較舊版本的瀏覽器逐步停止使用。這意味著將轉(zhuǎn)換為。在組件的情況下,寫入的將如下所示在我們?cè)诘谝粋€(gè)作出反應(yīng)組件使用的語(yǔ)法是語(yǔ)法。 本文轉(zhuǎn)載自:眾成翻譯譯者:iOSDevLog鏈接:http://www.zcfy.cc/article/3797原文:https://www.fullstackreact....

    Eirunye 評(píng)論0 收藏0
  • 全棧React6: 狀態(tài)

    摘要:無(wú)論何時(shí)狀態(tài)改變通過(guò),組件將重新投遞。在調(diào)用函數(shù)之后,我們可以將第二個(gè)參數(shù)傳遞給函數(shù),該函數(shù)將在狀態(tài)更新后保證被調(diào)用。今天,我們更新了我們的組件以使其處于狀態(tài)狀態(tài),現(xiàn)在有必要處理如何使組件成為狀態(tài)。 本文轉(zhuǎn)載自:眾成翻譯譯者:iOSDevLog鏈接:http://www.zcfy.cc/article/3824原文:https://www.fullstackreact.com/30-d...

    leo108 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<