Gui Blog。

Vue

/2 min

讓 emit 回傳資料給 Vue 父層元件！

上一次介紹了 初步認識 Vue Props，父元件傳入值給子元件！，但是然後呢？如果我需要回傳值到父層元件，該怎麼做呢？今天就來介紹 emit 這個機制，能夠達到這樣的需求。

#Vue

/2 min

初步認識 Vue Props，父元件傳入值給子元件！

Vue 的頁面由一組又一組的元件所組成，其中或多或少會需要元件之間傳遞值，首先如果是父層元件要將值傳給子層元件，該怎麼設定呢？今天就來介紹 Props 這個能夠將值傳遞給子元件的機制。

#Vue

/2 min

Vue 條件渲染 v-if 如何使用？與 v-show 有什麼差別？

假設網頁中有一個情境是不同的條件顯示不同的區塊，像是非登入狀態顯示登入與註冊連結、登入狀態顯示登出連結，類似這種情境怎麼做到？以 Vue 來說，此時就能使用條件渲染 v-if、v-show 等指令。

#Vue

/2 min

v-on：Vue 事件觸發器

v-on 能夠透過 Event（如點擊事件）來觸發某個方法。 v-on 寫法與縮寫 一般寫法（以點擊事件為例） 縮寫（以點擊事件為例） 事件修飾符：prevent HTML 中的 a 或是 form 表單內的 post…

#Vue

/1 min

Vue 的幾個 V-model 修飾符：lazy、number、trim

v-model 可透過一些修飾符，來去對 input 進行限制與效果。 lazy：轉為 change 事件後同步 編輯資料時不會一起更動值，等到輸入完畢離開 input 後才會變動 number：改變 input 資料型…

#Vue

/1 min

讓 Vue 渲染資料在畫面上的幾個指令

使用 JS 原生要將資料渲染，還要取得 DOM 元素後在進行操作，但是在 Vue 內則可以讓我們省略撰寫渲染的部分，由 Vue 本身來進行渲染，今天要介紹以下四種指令可以幫助我們達到渲染效果。

#Vue

/1 min

Vue 起手式，載入 CDN 建立環境

之前學習 Vue 寫的筆記，先 Po 上來一下，預計這星期補上後續更熟悉後對 Vue 的了解。 引入 Vue CDN 引入 Vue CDN，載入 Vue 外部資源，讓網頁能夠讀取 Vue 功能 在 HTML、JavaSc…

#Vue