20分鐘徹底明白vue

2021-08-08 03:46:20 字數 1013 閱讀 8382

初學vue時,使用script引入該框架,基本的語法過一遍,這不是什麼難事。

進步到了這裡,通常不太明白的是vue的核心思想–資料驅動。

一句話解釋:

傳統jquery操作: html原始檔 --> 瀏覽器解析 --> 渲染為最終呈現頁面

vue資料繫結: html原始檔 —> vue攔截,進行dom-diff計算 --> 瀏覽器解析 --> 渲染為最終呈現頁面

相對傳統html的載入方式,也就多了一步。

這樣做的目的是因為:對瀏覽器而言,dom操作會造成頁面變化呈現,非常慢,而js的計算速度非常快。

mvvm框架都是通過js的計算,計算出最小渲染區域,然後通過瀏覽器顯示出來,讓變化的區域減小,所以速度就提公升了。

初學時,跟著各種教程走,vue-cli@2初始化,安裝npm包,啟動伺服器…運氣不錯的話應該是不會有一堆錯誤的。

那麼這裡遇到的問題是不理解伺服器。

一句話解釋:

傳統html開發模式,新建乙個hthm頁面,寫上一些js,css,通過瀏覽器直接開啟,大功告成。

vue-cli開發模式:先通過vue-cli初始化乙個專案(vue init),然後安裝npm包(npm install),接下來啟動伺服器(npm run dev),開啟瀏覽器,大功告成。

對於沒有接觸過node的同學來說, 由於vue-cli的開發模式與傳統的開發模式不一樣,所以很難理解。

這一點需要了解的是,必須通過啟動伺服器才能看到頁面。

搬磚最重要的是:理解能力。

新的框架有新的用法,具體的用法都是小道,重要的是理解。

報錯問題出在**?能夠找到位置。

報錯原因是為什麼?檢視官方文件或搜尋對改錯誤的解釋。(這一步往往被輕視,導致低效)

仿照解決方法,自己去寫,而不是copy。(只需一次,就會銘記)

10分鐘,讓你徹底明白Promise原理

什麼是promise?本 用定外賣來舉例子,讓你明白。定外賣就是乙個promise,promist的意思就是承諾 我們定完外賣,飯不會立即到我們手中 這時候我們和商家就要達成乙個承諾 在未來,不管飯是做好了還是燒糊了,都會給我們乙個答覆 function orderfood else 5000 你在...

1分鐘睡眠瑜伽 徹底告別失眠

快節奏的生活 忙碌的工作狀態,適合緊繃的神經很難停歇,而且平時又缺乏鍛鍊,缺少溝通和交流,積攢的心理壓力和煩惱,會慢慢把人累垮,漸漸的失眠多夢的人多了起來,對於傳統方法的數羊群或者睡前喝牛奶,也只是適合某些人群,今天瑜公尺之伽小編給大家送上福利,1分鐘,輕輕鬆鬆讓你安然入眠的睡眠瑜伽。近日有一位哈佛...

20分鐘學會Ruby(1 4)

前言 請點我。互動式ruby 開啟irb ok,如圖所示,那它就是被開啟了。輸入 hello world 按回車,結果如下圖所示 ruby任你使喚 剛才發生了什麼?我寫了乙個世界上最短的 hello world 程式?基本上是的!第二行只是irb告訴我們求解最後一行表示式的結果。如果我們想在螢幕上列...