react(軟體行業名詞)

react(軟體行業名詞)

本詞條是多義詞,共3個義項
更多義項 ▼ 收起列表 ▲

React 起源於 Facebook 的內部項目,因為該公司對市場上所有 JavaScript MVC 框架,都不滿意,就決定自己寫一套,用來架設Instagram 的網站。做出來以後,發現這套東西很好用,就在2013年5月開源了。

基本介紹

  • 外文名:React
  • 公司: Facebook
  • 作用:架設Instagram 的網站
  • 特點:聲明式設計、高效、靈活
由於 React的設計思想極其獨特,屬於革命性創新,性能出眾,代碼邏輯卻非常簡單。所以,越來越多的人開始關注和使用,認為它可能是將來 Web 開發的主流工具。
這個項目本身也越滾越大,從最早的UI引擎變成了一整套前後端通吃的 Web App 解決方案。衍生的 React Native 項目,目標更是宏偉,希望用寫 Web App 的方式去寫 Native App。如果能夠實現,整個網際網路行業都會被顛覆,因為同一組人只需要寫一次 UI ,就能同時運行在伺服器、瀏覽器和手機。
React主要用於構建UI。你可以在React里傳遞多種類型的參數,如聲明代碼,幫助你渲染出UI、也可以是靜態的HTML DOM元素、也可以傳遞動態變數、甚至是可互動的套用組件。
特點:
1.聲明式設計:React採用聲明範式,可以輕鬆描述套用。
2.高效:React通過對DOM的模擬,最大限度地減少與DOM的互動。
3.靈活:React可以與已知的庫或框架很好地配合。
示例
下面這段代碼將會在在頁面容器中呈現出“Hello Tom”:
[xml]view plaincopy
  1. /**@jsxReact.DOM*/
  2. varHelloMsg=React.createClass({
  3. render:function(){
  4. return<div>{'Hello'+this.props.name}</div>;
  5. }});
  6. React.renderComponent(<HelloMsg name="Tom"/>,mountNode);
該例使用一個類似XML語法的JSX來構建組件,實現一個render()方法,並且根據輸入的數據返回相應的結果。輸入的數據作為XML屬性傳遞給組件,render()方法通過this.props訪問這些輸入的數據。
也可以使用class語法或函式的方式創建組件:
import React from 'react'
import ReactDOM from 'react-dom'
class App extends React.Component{
render(){
return <div>helo {this.props.name}</div>
}
}
ReactDOM.render(<App name='Tom'/>,document.getElementById('node'))
或:
import React from 'react';
import ReactDOM from 'react-dom'
const App = props =><div>hello {props.name}</div>;
ReactDOM.render(<App name='Tom'/>,document.getElementById('node'))

相關詞條

熱門詞條

聯絡我們