国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁(yè) > 開發(fā) > JS > 正文

干貨!教大家如何選擇Vue和React

2024-05-06 16:35:48
字體:
供稿:網(wǎng)友

兩者之間的相同之處

同樣是基于組件開發(fā)的輕量級(jí)框架,同樣是專注于用戶界面的視圖view層。

如何選擇

1.1 如果喜歡用模板搭建應(yīng)用(或者有這個(gè)想法)選擇Vue

Vue應(yīng)用默認(rèn)的是把markup放在HTML中,數(shù)據(jù)綁定表達(dá)式和Angular一樣,采用{{}}的形式,而指令(特殊的HTML屬性)用來向模板中添加功能

<div> <p>{{ message }}</p> <button v-on:click="reverseMessage">Reverse Message</button></div>// JSnew Vue({ el: '#app', data: { message: 'Hello Vue.js!' }, methods: { reverseMessage: function () {  this.message = this.message.split('').reverse().join(''); } }});

React使用的是JSX語(yǔ)法(在Javascript中創(chuàng)建DOM),而不使用模板。

<div id="app"></div>// JS (pre-transpilation)class App extends React.Component { constructor(props) { super(props); this.state = {  message: 'Hello React.js!' }; } reverseMessage() { this.setState({   message: this.state.message.split('').reverse().join('')  }); } render() { return (  <div>  <p>{this.state.message}</p>  <button onClick={() => this.reverseMessage()}>   Reverse Message  </button>  </div> ) }}ReactDOM.render(App, document.getElementById('app'));

模板可以更好地把布局和功能分隔開,但是需要學(xué)習(xí)所有的HTML擴(kuò)展語(yǔ)法,而渲染函數(shù)只需要標(biāo)準(zhǔn)的HTML和Javascript。

注意:vue2.0提供使用模板和渲染函數(shù)的選項(xiàng)

1.2 想要簡(jiǎn)單一點(diǎn)的語(yǔ)法,更快的渲染速度,選擇vue

使用Vue不需要轉(zhuǎn)譯,直接運(yùn)行在瀏覽器中,但是React代碼重度依賴于JSX和ES6語(yǔ)法。

1.2.1 兩者處理數(shù)據(jù)的方式不一樣

vue的數(shù)據(jù)可變,React的數(shù)據(jù)不可變

//vuethis.message = this.message.split('').reverse().join('');//Reactthis.setState({  message: this.state.message.split('').reverse().join('') });

對(duì)于state的數(shù)據(jù)變化,Vue比React的重新渲染系統(tǒng)更快更有效率。

1.3 想要構(gòu)建一個(gè)大型的應(yīng)用程序,選擇React

模板的使用會(huì)阻礙應(yīng)用擴(kuò)展到更大規(guī)模,模板容易出現(xiàn)很難注意到的運(yùn)行時(shí)的錯(cuò)誤,同時(shí)也很難去測(cè)試,重構(gòu),分解。

1.4 想要一個(gè)同時(shí)適用于web端和原生APP的框架,選擇React

React Native 是一個(gè)使用Javascript構(gòu)建出移動(dòng)端原生應(yīng)用程序(ios Android)的庫(kù),與React。js相同,只是不使用web組件,而是使用原生組件,只要會(huì)其中一個(gè),就會(huì)另一個(gè),
這樣無論是開發(fā)web端還是移動(dòng)端都可以用。

1.5 要最大的生態(tài)系統(tǒng),最全面問題解決,更全的工具和插件可以使用React

具數(shù)量統(tǒng)計(jì),React在npm上的下載量為250萬(wàn)/月,vue為22.5萬(wàn)/月

React是facebook的,會(huì)得到全面的支持與維護(hù),vue是尤雨溪

帶領(lǐng)的小團(tuán)隊(duì)維護(hù)的。

總結(jié)一下,我們發(fā)現(xiàn)的,Vue的優(yōu)勢(shì)是:

- 模板和渲染函數(shù)的彈性選擇
- 簡(jiǎn)單的語(yǔ)法和項(xiàng)目配置
- 更快的渲染速度和更小的體積

React的優(yōu)勢(shì)是:

- 更適合大型應(yīng)用和更好的可測(cè)試性
- Web端和移動(dòng)端原生APP通吃
- 更大的生態(tài)系統(tǒng),更多的支持和好用的工具
- 然而,React和Vue都是很優(yōu)秀的框架,它們之間的相似之處多過不同- 之處,并且大部分的優(yōu)秀功能是相通的:
* 用虛擬DOM實(shí)現(xiàn)快速渲染
* 輕量級(jí)
* 響應(yīng)式組件
* 服務(wù)端渲染
* 集成路由工具,打包工具,狀態(tài)管理工具的難度低
* 優(yōu)秀的支持和社區(qū)

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持VeVb武林網(wǎng)。


注:相關(guān)教程知識(shí)閱讀請(qǐng)移步到JavaScript/Ajax教程頻道。
發(fā)表評(píng)論 共有條評(píng)論
用戶名: 密碼:
驗(yàn)證碼: 匿名發(fā)表
主站蜘蛛池模板: 枞阳县| 广东省| 苗栗市| 屯门区| 郓城县| 阿合奇县| 昭苏县| 白河县| 赤壁市| 葫芦岛市| 邢台县| 曲阜市| 洛川县| 青田县| 兰考县| 峡江县| 延寿县| 义乌市| 大港区| 蓝田县| 常宁市| 永登县| 连平县| 马鞍山市| 新乡县| 建昌县| 蓝山县| 嘉峪关市| 怀远县| 靖西县| 拉萨市| 阿拉尔市| 区。| 崇左市| 海口市| 柳河县| 黎平县| 塔河县| 沐川县| 临清市| 宁蒗|