React 前言

2022-03-08 10:50 更新

React 構(gòu)建狀態(tài) 新版本

React 是一個用于構(gòu)建用戶界面的JavaScript庫。

  • 用做UI: 許多人把React當(dāng)做MVC設(shè)計模式中的視圖(view),當(dāng)把React成為你的技術(shù)掌握之后, 它可以很輕松應(yīng)用于一個小功能的項目。
  • 虛擬DOM:React用一個”虛擬DOM”實現(xiàn)了超高的性能,配合nodeJS也可以實現(xiàn)在服務(wù)端的渲染,不存在耗時的瀏覽器dom渲染。
  • 數(shù)據(jù)流: React是一種減少引用數(shù)據(jù)流的實現(xiàn)方式,并且比傳統(tǒng)的方式更容易實現(xiàn)數(shù)據(jù)綁定。

NEW! 查看我們最新的項目React Native, 它使用React和JavaScript創(chuàng)建本地應(yīng)用(比如Android和iOS的APP)。

實例

class HelloMessage extends React.Component{

    render(){

        return <div>你好 {this.props.name}</div>;

    }

}

ReactDOM.render(

    <HelloMessage name="W3Cschool" />,

    document.getElementById('example')

);


嘗試一下 ?


此示例將“你好 W3Cschool”呈現(xiàn)在頁面里(頁面中的id為example的元素里)。

你會注意到我們使用類似HTML的語法,我們稱之為JSX。 React不一定需要使用JSX,但是它使代碼更可讀,寫它感覺像寫HTML。

 React中包含一種簡單的變換,它允許將JSX轉(zhuǎn)換為本地JavaScript,供瀏覽器進行使用。

 沒有轉(zhuǎn)換的JSX是不能直接在本地瀏覽器上運行的。

安裝

對于初學(xué)者而言,最快的方法是在HTML中引用CDN提供的JavaScript庫:

<script src="https://unpkg.com/react@17/umd/react.production.min.js" rel="external nofollow" ></script>

<script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js" rel="external nofollow" ></script>

<script src="https://unpkg.com/babel-standalone@6/babel.min.js" rel="external nofollow" ></script>



以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號