Vuido

你正在使用 Vue.js 嗎？現在你也可以使用它來開發桌面應用程式囉～

Vue.js

Vue.js 可以在新增、更新或移除 DOM 時使用 CSS 顯示過場效果及動畫，讓元素或元件產生漸進變化。動畫效果可以自己設定，也可以使用第三方的函式庫。

Vue.js

Laravel 允許我們在 Artisan 中加入自己的指令，而我們每次在建立一個 Vue 元件檔時，動作及內容都差不多，這些重覆的流程就應該把它們自動化。

Vue.js

接續前一篇 Vue.js (11) - 在 Laravel 5.4 中使用 Vue 2.1，這一篇將要實戰如何寫出一個 CRUD 的應用，也就是對資料庫做建立、讀取、更新及刪除的動作。

Vue.js

Laravel 在第 5 版時已經內建支援 Vue，這篇將簡單介紹如何使用它們一起工作。

Vue.js

不論是在 Vue 實體中建立區域元件，或是使用 Vue.component 來建立全域元件，這些都只適合在用在簡單的小元件上，當元件變得複雜時，在開發上會變得很沒效率，這時可以使用 Vue 提供的單一元件檔來解決這個問題。

Vue.js

接續上一篇，接下來要來瞭解如何透過事件向父元件傳遞訊息，以及如何使用插槽，還有動態元件怎麼用。

Vue.js

基本上，看完前面幾個章節的內容就已經瞭解 Vue.js 的基本功能了，但 Vue.js 還提供許多很棒的功能，其中之一就是元件。元件就像一個自訂的 HTML 元素，將相關的功能全都封裝在一起，它們就像一個個的積木，你可以用它們來建立整個網站，而且不但易於日後維護，同時也容易重覆使用。

Vue.js

看了那麼多使用 Vue 的範例，最後我們來看看 Vue 實體以及它從建立到銷毀的整個生命週期，以便對 Vue 有更完整的瞭解。

Vue.js

在 HTML 元素中有 class 及 style 屬性，我們可以透過它們來指定 CSS 中的樣式，或直接寫在元素中。由於它們是屬性，所以當然可以透過 v-bind 指令來綁定它們的值，而 Vue.js 對這兩個屬性提供了增強功能，表達式除了可是是字串外，還可以是陣列或物件。

Vue.js

為了讓 View 專注在顯示資料，你應該將需要複雜計算的程式邏輯抽離，讓顯示 View 的模版簡潔，Vue 設計了一個計算屬性讓你這麼做。

Vue.js

對於表單元素，Vue.js 提供一個專用的指令，可以讓你將 View 及資料建立雙向綁定。當雙向資料綁定建立之後，使用者輸入的內容會自動儲存到一個變數中，同時，這個變數的資料會被更新到所有和它綁定的 View 中，看起來就像是立即的資料同步。

Vue.js

Vue.js 將事件偵聽放在 HTML 中，透過 ViewModel 將事件處理方法和表達式綁在當前的 View 上，你可以很容易找到事件偵聽器對應的處理方法，由於你不必手動去綁定事件，你的事件處理程序的程式碼就可以非常的單純只專注在處理事件上。

Vue.js

Vue.js 提供好用的指令讓你能控制資料的顯示，過濾器則能讓你格式化將要輸出的文字。

Vue.js

Vue.js 已經幫你處理好 DOM 和資料的綁定，於是你可以用很輕鬆的方式來處理資料如何呈現，而且當資料發生變動時，還會及時的反應在 View 上。

Vue.js

Laravel 從第 5 版開始內建支援 Vue.js 的使用，一開始想說怎麼「又」冒出了一個 JavaScript 框架。用了一陣子後，覺得真的是好物，因為簡單易用，所以學起來也很容易，當然進階的部份還是要花點腦力，但即使只學基礎的部份，也足夠讓你快速完成工作。