純小白入手 vue3.0 CLI - 2.5 - 瞭解組件的三維

vue3.0 CLI 真小白一步一步入手全教程系列：https://www.cnblogs.com/ndos/category/1295752.html

個人 github 地址 - vue3.0Study - 階段學習成果都會創建分支。

==========================

問答

一、vue 組件有什麼？

爲何要加上 vue，由於不一樣的 MVC 框架，東西不同，不過基本的功能都有。

組件有 data、computed、watch、methods 以及生命週期鉤子等。對於入門者來講，先搞清楚這些是什麼東西。

data 屬性通過前面幾篇文章的學習，對其已有初步的瞭解。

computed 是計算屬性，前面也有了解。

methods 組件方法，實際上是專門定義函數的一個對象，這些函數最終綁定到組件上。

watch 和 生命週期鉤子 也不是什麼高深的東西！就是個函數而已，別被這些【高大上】的名字給嚇着。後面會學習它們。若是瞭解過 C++ 或 JAVA 的函數重載的概念，那就這麼理解這兩個東西吧。

二、什麼是組件？

組件也不是什麼高深的東西。html 標籤 div form img 等知道吧，都是【組件】, 只不過呢，vue 裏邊的組件能夠本身命名，也能夠定義本身的屬性等等，說白了，就是擴展標籤。

關於組件，標準實際上已經實現了，叫作【自定義元素】，谷歌爲那些沒有實現這個標準的瀏覽器作了個 polyfill，也便是 【polymer】框架：polymer地址，都出到 3.0 版本了，谷歌一直在維護。

三、組件還有什麼須要瞭解的？

組件複用、組件註冊、組件組織、組件怎麼互相傳遞數據、組件插槽、動態組件等內容。

組件複用，其實就是搞成一個 html【標籤】。它怎麼用，傳遞什麼數據給它，它有什麼交互功能，怎麼顯示 ( 前面幾篇文章就在介紹這些 ) 都已預約義。

組件註冊 和 組件組織，結合起來理解。仍是用 html 來理解，div 能夠包含 div ( 子元素 )；組件也能夠包含子組件；html 是如何組織的，組件也是如何組織；註冊是怎麼回事？vue 中組件要使用其餘組件，必須 import 其餘組件，這就是註冊啦。對！註冊和組織，就是這麼簡單！

註冊還有全局註冊和局部註冊，之後學習慢慢介紹。

傳遞數據。html 標籤之間，沒法本身傳遞數據 ( 固然，有些 css 屬性好比 font-size，是單向傳遞的 )。vue 組件可不同，父組件不僅僅能夠給子組件傳遞數據，子組件也能夠給父組件傳遞數據。父 => 子 用 props；子 => 父 用 emit 事件。

插槽。我以爲實際運用過程當中，也不必定非要用，之後學習在介紹。

動態組件。好比 nav 導航條，每一個導航，能夠理解爲單個組件，組件複用以後呢，就是導航條。那麼怎麼知道目前的導航是哪一個呢？這就是動態組件的用處。

組件須要瞭解的東西，簡單介紹到這裏。

高端一點的東西

上面說的，組件的數據流啊、動態和異步組件啊、訪問組件的特殊方式啊、依賴注入啊、強制更新啊等等東西，學習到路由的時候，組件跟路由的糾纏關係啊，還有狀態管理系統跟組件的關係等等，就不說那麼多東西來嚇人，其實這些東西也不是高深的東西，之後我會抽絲剝繭的用形象的方式介紹出來。

==========================

好的，學習這篇文章，對於組件應該有了一個比較平面的認識，下面的學習，讓這個認識立體化。