程式設計Vue 父子元件傳值
Hint 為了共用，子元件製作時儘可能做 loose coupling、才不會有多個子元件共同修改同一個值的問題loose coupling 的架構下，【父 ➞ 子】用 props 單向傳入、【子 ➞ 父】用 emits 單向傳出 不希望元...
Vue2
程式設計程式設計利用 Vue inheritAttrs: false 繼承屬性到第二層子元件
用在：html 有複數層的子元件，加上inheritAttrs: false 的話才能將 native attribute 透過 $attr 傳入第二層的 html tag 中、且不會影響第一層的 label Vue2 例如下方範例的 re...
程式設計VueJS v-model 語法糖
v-model 只是語法糖，省去每次寫 :value="xxx" @input="ooo" 這些語法，用來自動處理 input / output v-model 預設的 prop: value, emit-event: input expo...
程式設計VueJs delay input search 延遲搜尋
一般的實作會用 v-model="searchedEmail"，然後 listen inputed 的變化後向 server 發送值 問題點：每輸入一個字元就向自已的 server 發送 request，連續一直輸入，其實就是自體DDoS攻...
程式設計VueJs Dynamic components & import 動態元件
不用寫一堆 v-ifv-if-else 來區分元件，一個 component 元件就可以 <component v-bind:is="currentTabComponent"></component> const currentTabCo...
程式設計VueJS Event Bus
Vue2 利用 vue 本身 global 的物件產生通道傳值 // define import Vue from 'vue'; const EventBus = new Vue(); export default EventBus // ...