Vue Component

上一篇提及了 import 與 require 之後，我們現在把重心移到元件本身的一些屬性上面。本次內容將會圍繞在 :is 這一個元件屬性上面，我們來看看這個魔術方法到底可以做到哪些事情。 還有，可以做到什麼程度（燦笑） -------------------------------------------------------------------------------- :is 屬性 這個屬性相當特別，他的目的是，將使用這個屬性的元件替換掉，替換成你所 指定 的 Vue 元件。換句話說，你只要把你的 Vue 元件引入後，甚至可以不需要在父層元件設定 components，就可以使用。

我們講完元件的應用之後，本次篇章我們會來說明一下，關於 import 與 require 在元件當中的應用。這兩個方法對於現今的 JavaScript 來說，並不是什麼新奇的東西。而搭配 Vue 的元件又能玩出什麼新的把戲？讓我們繼續看下去。 -------------------------------------------------------------------------------- require 方法 這個方法在一般的 JavaScript 當中很常見，主要目的就是為了將檔案讀取進來。而在 Vue 裡面，他不僅僅是可以引入 JavaScript 檔案，連同圖片檔案也可以利用這種方式來載入。只是圖片檔案利用 require 載入後，會變成以

上一個篇章提到了基本的元件使用，雖然說是比較基礎的部分，但前前後後也寫了超過四千字的廢話。對於 Vue 比較熟悉的人來說，應該不會有什麼障礙才對。我們今天將會繼續提及，關於元件使用上的一些進階應用，也會接續上一篇比較沒有著墨的部分。 -------------------------------------------------------------------------------- 關於混合 Mixins 上一篇有約略提到 Mixins 的個特性，有曾經寫過 SCSS/SASS 的人應該對於這個東西不陌生。是的，他有點類似，也是將一些共用的函數提出去的一種作法。 實際上，Mixins 很類似一個元件的結構，只是他是被封裝成一個物件（ Object ），然後透過元件的 mixins 屬性來導入。而 Mixins

現今算是 Web Component 當道，如果撇除 HTML5 原生的元件，那麼其實各家不管是 Vue, React 還是 Angular，大多都是圍繞的這個議題。 我們這裡開始會針對 Component 做一系列的操作，你可以想像成整個 Vue 生態中，大部分的時間是圍繞在 Component 上面的。所以我們這裡會慢慢的從基本使用上提起，如果對於 Vue 有初階認識的，或許可以跳過這裡（應該吧？） -------------------------------------------------------------------------------- Component a.k.a