在《React中文參考手冊》中,React 是一個用於建立使用者介面的 JAVASCRIPT 函式庫。 React主要用於建立UI,許多人認為 React 是 MVC 中的 V(視圖)。 React 起源於 Facebook 的內部項目,用來架設 Instagram 的網站,並於 2013 年 5 月開源。 React 擁有較高的效能,程式碼邏輯非常簡單,越來越多的人開始關注和使用它。
React(有時叫React.js或ReactJS)是一個提供資料渲染為HTML視圖的開源JavaScript 函式庫。 React視圖通常採用包含以自訂HTML標記規定的其他元件的元件渲染。
React為程式設計師提供了一個子元件不能直接影響外層元件("data flows down")的模型,資料改變時對HTML文件的有效更新,和現代單頁應用程式中元件之間乾淨的分離。
React由Facebook 的軟體工程師Jordan Walke創作。他受到PHP的HTML元件框架XHP影響。該框架首先於2011年部署於Facebook的 newsfeed,隨後於2012年部署於Instagram。它於2013年5月在JSConf US開源。
提示:在開始學習 React 之前,您需要具備HTML5、CSS、JavaScript的基礎知識。
下面讓我們感受第一個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>
執行實例»
點擊"運行實例" 按鈕查看線上實例
由於React的設計想法極為獨特,屬於革命性創新,因此性能出眾,程式碼邏輯卻非常簡單。所以,越來越多人開始關注和使用,認為它可能是未來的 Web 開發的主流工具。
提示:我們的React教學將幫助您逐步學習如何掌握並應用React,如果你有任何疑問,請前往PHP中文網React社群提出你的問題,會有熱心網友為你解答。
React特點:
聲明式設計:React採用宣告範式,可以輕鬆描述應用。
高效率:React透過DOM的模擬,最大限度地減少與DOM的交互作用。
靈活:React可以與已知的函式庫或框架很好地配合。
本React教學手冊涵蓋的內容
本React教學手冊涵蓋所有React基礎使用方法,包含React安裝、React元素渲染、React JSX、React元件、 React Props、React AJAX、React實踐處理等等知識。
提示:本教學的每一章都包含了許多React實例,您可以直接點擊 "執行實例" 按鈕線上查看結果。這些例子將幫助您更好地理解和使用React。
最新章節
- 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(状态) 2016-10-19
- React 组件 2016-10-19
相關課程
- Web前端開發極速入門 2021-12-10
- 最懂你的大前端課:HTML5/CSS3/ES6/NPM/Vue/...【原文】 2022-09-30
- Gulp入門影片教學 2022-04-18
- 兄弟連高洛峰CSS3影片教程 2022-04-20
- AngularJS開發Web應用程式基礎實例影片教學 2022-04-18
- Ajax全接觸 2022-04-13
- MUI框架基礎影片教學 2022-04-13
- 線上訓練班試聽課 2019-01-10