react生成組件方式

sushi 發(fā)布于2019-08-22 17:20 / 717人閱讀

摘要：有三種方式，這里簡(jiǎn)單筆記，后續(xù)更新方式一常量法定義適用于簡(jiǎn)單組件，通常在文件，被其他組件調(diào)用方式二函數(shù)法定義水會(huì)燒開(kāi)水不會(huì)燒開(kāi)適用于簡(jiǎn)單組件，通常在文件，被其他組件調(diào)用。

有三種方式，這里簡(jiǎn)單筆記，后續(xù)更新

方式一："常量"法定義

 const element = (
   
     Hello, world!
     It is {new Date().toLocaleTimeString()}.
   
 );

適用于簡(jiǎn)單組件，通常在xx.js文件，被其他組件調(diào)用

方式二：函數(shù)法定義

function BoilingVerdict(props) {
  if (props.celsius >= 100) {
    return 水會(huì)燒開(kāi);
  }
  return 水不會(huì)燒開(kāi);
}

適用于簡(jiǎn)單組件，通常在xx.js文件，被其他組件調(diào)用。(這里也可以用es6定義)

方式三：ES6 class 類(lèi)來(lái)定義

class Welcome extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }
  render() {
    return Hello, {this.props.name};
  }
}

適用于組件里有復(fù)雜邏輯，我把他稱(chēng)做應(yīng)用組件

云服務(wù)器 GPU云服務(wù)器生成快捷方式 topic生成方式正則 react _React

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

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

相關(guān)文章

react-router-dom v^4學(xué)習(xí)歷程（一）

摘要：用于精準(zhǔn)匹配路徑，不用也會(huì)匹配到匹配的路徑的子路徑，這樣兩個(gè)路由組件都會(huì)顯示。路徑中傳遞參數(shù)到路由到的組件，就是在路徑前面加上這樣這個(gè)路由地址就會(huì)變成一個(gè)參數(shù)被組件接受到。例如可以獲取到當(dāng)前的基礎(chǔ)路徑。 react-router-dom的版本已經(jīng)更新到了4.1.1，那么我們就一起來(lái)學(xué)習(xí)學(xué)習(xí)react v4這個(gè)新版路由的基本使用吧！在學(xué)習(xí)路由之前我們先需要復(fù)習(xí)幾個(gè)基礎(chǔ)知識(shí)，關(guān)于reac...

KevinYan 2019-08-20 16:25 評(píng)論0 收藏0
玩轉(zhuǎn)React樣式

摘要：里面的元素可以分為兩類(lèi)，一個(gè)是和后面的輸入框，另一類(lèi)是提交按鈕。就是我們定義的樣式對(duì)象。比如，我現(xiàn)在想要定制不同的用戶(hù)名密碼輸入框的邊框顏色。根據(jù)不同的狀態(tài)顯示不同顏色的文本輸入框有兩種狀態(tài)，和。方法就會(huì)根據(jù)不同的狀態(tài)返回不同的樣式。很久很久以前，就有人用CSS來(lái)時(shí)給HTML內(nèi)容添加樣式。CSS可以最大限度的分離樣式和內(nèi)容，選擇器也可以很方便的給某些元素添加樣式。你根本找不到任何不用...

scq000 2019-08-29 11:16 評(píng)論0 收藏0
React前端學(xué)習(xí)小結(jié)

摘要：正式開(kāi)始系統(tǒng)地學(xué)習(xí)前端已經(jīng)三個(gè)多月了，感覺(jué)前端知識(shí)體系龐雜但是又非常有趣。更新一個(gè)節(jié)點(diǎn)需要做的事情有兩件，更新頂層標(biāo)簽的屬性，更新這個(gè)標(biāo)簽包裹的子節(jié)點(diǎn)。正式開(kāi)始系統(tǒng)地學(xué)習(xí)前端已經(jīng)三個(gè)多月了，感覺(jué)前端知識(shí)體系龐雜但是又非常有趣。前端演進(jìn)到現(xiàn)在對(duì)開(kāi)發(fā)人員的代碼功底要求已經(jīng)越來(lái)越高，幾年前的前端開(kāi)發(fā)還是大量操作DOM，直接與用戶(hù)交互，而React、Vue等MVVM框架的出現(xiàn)，則幫助開(kāi)發(fā)者從...

iOS122 2019-08-23 15:58 評(píng)論0 收藏0
【譯】統(tǒng)一樣式語(yǔ)言

摘要：原文地址原文作者譯文出自掘金翻譯計(jì)劃譯者校對(duì)者統(tǒng)一樣式語(yǔ)言在過(guò)去幾年中，我們見(jiàn)證了的興起，尤其是在社區(qū)。根本上來(lái)說(shuō)，純粹用于只是一個(gè)命名規(guī)范，它要求樣式的類(lèi)名要遵守的模式。原文地址：A Unified Styling Language 原文作者：Mark Dalgleish 譯文出自：掘金翻譯計(jì)劃譯者：ZhangFe 校對(duì)者：JackGit,yifili09 統(tǒng)一樣式語(yǔ)言在過(guò)...

fjcgreat 2019-08-29 12:49 評(píng)論0 收藏0
react-redux

摘要：主要用于構(gòu)建，被認(rèn)為是中的視圖。高效通過(guò)對(duì)的模擬，最大限度地減少與的交互。也就是說(shuō)，用戶(hù)負(fù)責(zé)視覺(jué)層，狀態(tài)管理則是全部交給它。該回調(diào)函數(shù)必須返回一個(gè)純對(duì)象，這個(gè)對(duì)象會(huì)與組件的合并。 React 定義： React 是一個(gè)用于構(gòu)建用戶(hù)界面的 JAVASCRIPT 庫(kù)。React主要用于構(gòu)建UI，React 被認(rèn)為是 MVC 中的 V（視圖）。特點(diǎn)：聲明式設(shè)計(jì) ?React采用聲明范式...

sanyang 2019-08-20 16:22 評(píng)論0 收藏0
Taro 簡(jiǎn)介

摘要：讓人又愛(ài)又恨的微信小程序自微信小程序以下簡(jiǎn)稱(chēng)小程序誕生以來(lái)，就伴隨著贊譽(yù)與爭(zhēng)議不斷。同時(shí)于開(kāi)發(fā)者來(lái)說(shuō)，小程序的生態(tài)不斷在完善，許多的坑已被踩平，雖然還是存在一些令人詬病的問(wèn)題，但已經(jīng)足見(jiàn)微信的誠(chéng)意了。 Taro 介紹在互聯(lián)網(wǎng)不斷發(fā)展的今天，前端程序員們也不斷面臨著新的挑戰(zhàn)，在這個(gè)變化多端、不斷革新自己的領(lǐng)域，每一年都有新的美好事物在發(fā)生。從去年微信小程序的誕生，到今年的逐漸火熱，以及...

sixgo 2019-08-23 16:18 評(píng)論0 收藏0