動態切換元件 今天來點輕鬆的，其實是我最近比較累所以沒辦法打太多東西，所以來介紹一個簡單的元件動態切換的方式，之前有使用動態的方式來切換 className 還...
元件插槽 Slot 我們會將需要重複使用的區塊建立成元件，這樣可以方便我們重複使用，但是如果遇到我需要替換部份內容的時候，該怎麼辦呢？難道要再新建一個元件嗎？答...
emit 向外層傳遞資訊 昨天我們提到了如何將資料由外層傳向內層，用 props 的方式可以將資料由外向內傳遞，那如果我們想要將內層的資料向外層傳遞時該怎麼做呢...
Props 特性，由外向內的資料傳遞 元件與元件之間的資料都是各個獨立的，所以才不會互相干擾，如果遇到需要由父層傳遞資料給子層的時候，我們可以使用 props，...
全域註冊 昨天介紹了 Vue 中非常重要的元件，今天我們就來看看元件究竟要怎麼使用吧！首先來是全域註冊的方式，直接來看範例： <div id="...
元件 Components 基礎介紹 元件的概念在 Vue 中是非常重要的一個環節，Vue 應用程式都是從建立根實體開始，之後再一個一個元件搭建上去，而透過元件...
Vue Instance Vue 的生命週期是一個相當重要的觀念， Vue 應用程式是從 Vue 建構式( Vue constructor )建立根實體( Vu...
Filter 過濾 今天來介紹過濾 filter，過濾顧名思義就是能夠將資料在顯示之前作前處理的方式，直接來看範例會比較清楚。 <div id="...
Watch 監聽屬性 今天來介紹監聽 watch 的用法，這個可以讓我們監聽某個值，而當這個值有更動的時候，就去執行某些事情，請看下面範例： <!-- 這...
計算屬性 Computed 今天來介紹的是 computed 這個方法，能夠直接將結果存到變數之中，並且是可以直接使用的，直接來看下面的範例會比較清楚唷！ &l...
列表渲染 在 Vue 中，我們會使用 v-for 來迭代陣列中的元素。下方我先在 Vue 的應用程式中建立一個陣列為 list ： new Vue({ el...
條件渲染 今天來介紹 v-if 和 v-show，並比較兩者之間的差異。 v-if 如果希望某些區塊在特定條件下才出現，就可以使用 v-if 、 v-else-...
動態切換 className 今天來介紹一點運用的範例，這是關於是件綁定跟屬性綁定的運用，如果對事件綁定 ( v-on ) 和屬性綁定 ( v-bind )還不...
前面有提到屬性綁定，在這裡我來介紹事件綁定及資料綁定，就讓我們開始吧！ 事件綁定 v-on 在網頁上，常常會有點擊、輸入資料等的互動事件，而如果你對 JavaS...
上一篇提到了 v-bind 的屬性綁定，今天就來提更多的屬性綁定的方法。 Class 與 Style 的綁定 我們先來看一個範例： <!-- 這是HTML...
上一篇介紹了如何用 CDN 的方式使用 Vue，然後建立一個 Vue 的應用程式，接下來幾天會介紹在 Vue 裡常用的一些語法。 屬性綁定：v-bind 能夠將...
初心 寫code開始，義大利麵到框架，後端碰到前端。為什麼到現在才寫Vue2呢？最主要的想法，是想把這個技術做個梳理，自學到哪？最後放棄的時候究...
Magisheng
iThome鐵人賽
看影片追技術