在《React中文參考手冊》中,React 是一個用於建立使用者介面的 JAVASCRIPT 函式庫。 React主要用於建立UI,許多人認為 React 是 MVC 中的 V(視圖)。 React 起源於 Facebook 的內(nèi)部項目,用來架設(shè) Instagram 的網(wǎng)站,並於 2013 年 5 月開源。 React 擁有較高的效能,程式碼邏輯非常簡單,越來越多的人開始關(guān)注和使用它。
React(有時叫React.js或ReactJS)是一個提供資料渲染為HTML視圖的開源JavaScript 函式庫。 React視圖通常採用包含以自訂HTML標記規(guī)定的其他元件的元件渲染。
React為程式設(shè)計師提供了一個子元件不能直接影響外層元件("data flows down")的模型,資料改變時對HTML文件的有效更新,和現(xiàn)代單頁應(yīng)用程式中元件之間乾淨(jìng)的分離。
React由Facebook 的軟體工程師Jordan Walke創(chuàng)作。他受到PHP的HTML元件框架XHP影響。該框架首先於2011年部署於Facebook的 newsfeed,隨後於2012年部署於Instagram。它於2013年5月在JSConf US開源。
提示:在開始學(xué)習(xí)?React?之前,您需要具備HTML5、CSS、JavaScript的基礎(chǔ)知識。
下面讓我們感受第一個react實例!
第一個react實例
實例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Hello React!</title> <script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script> <script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script> <script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script> </head> <body> <div id="example"></div> <script type="text/babel"> ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('example') ); </script> </body> </html>
執(zhí)行實例?
點擊"運行實例" 按鈕查看線上實例
由於React的設(shè)計想法極為獨特,屬於革命性創(chuàng)新,因此性能出眾,程式碼邏輯卻非常簡單。所以,越來越多人開始關(guān)注和使用,認為它可能是未來的 Web 開發(fā)的主流工具。
提示:我們的React教學(xué)將幫助您逐步學(xué)習(xí)如何掌握並應(yīng)用React,如果你有任何疑問,請前往PHP中文網(wǎng)React社群提出你的問題,會有熱心網(wǎng)友為你解答。
React特點:
聲明式設(shè)計:React採用宣告範式,可以輕鬆描述應(yīng)用。
高效率:React透過DOM的模擬,最大限度地減少與DOM的交互作用。
靈活:React可以與已知的函式庫或框架很好地配合。
本React教學(xué)手冊涵蓋的內(nèi)容
本React教學(xué)手冊涵蓋所有React基礎(chǔ)使用方法,包含React安裝、React元素渲染、React JSX、React元件、 React Props、React AJAX、React實踐處理等等知識。
提示:本教學(xué)的每一章都包含了許多React實例,您可以直接點擊?"執(zhí)行實例"?按鈕線上查看結(jié)果。這些例子將幫助您更好地理解和使用React。
最新章節(jié)
- React Refs 2016-10-19
- React 表單與事件 2016-10-19
- React AJAX 2016-10-19
- React 組件生命周期 2016-10-19
- React 組件 API 2016-10-19
- React Props 2016-10-19
- React State(狀態(tài)) 2016-10-19
- React 組件 2016-10-19
相關(guān)課程
- Web前端開發(fā)極速入門 2021-12-10
- 最懂你的大前端課:HTML5/CSS3/ES6/NPM/Vue/...【原文】 2022-09-30
- Gulp入門影片教學(xué) 2022-04-18
- 兄弟連高洛峰CSS3影片教程 2022-04-20
- AngularJS開發(fā)Web應(yīng)用程式基礎(chǔ)實例影片教學(xué) 2022-04-18
- Ajax全接觸 2022-04-13
- MUI框架基礎(chǔ)影片教學(xué) 2022-04-13
- 線上訓(xùn)練班試聽課 2019-01-10