單向數據流（One-Way Data Flow） 所有的 prop 都使得其父子 prop 之間形成了一個單向下行綁定：父級 prop 的更新會向下流動到子組...
晴
‧
2019-09-22
創建 CLI(command-line interface) 環境前，要先下載 node.js① ⌘ + space 搜尋終端機 terminal.app ②...
前言 昨天介紹了V-bind用法，今天我們就來介紹v-for吧！本文同步發表於Andy's Blog 參考資料：官網v-for介紹練習檔案 V-for 用途：...
混入(mixin)似乎也是個初學 Vue 比較少被用到的功能，但還是照順序的了解一下。 基礎運用 在模組中如果有重複出現的模組 option 內容，就可以透過...
前言 昨天我們簡單介紹了何謂 Vuex、 Vuex 運作流程以及 Vuex 可以幫我們解決什麼問題。那我們今天就來了解一下Vuex 核心概念該如何使用吧！ 開始...
Vue-cli 2 其實我還是比較習慣使用 vue-cli 2，所以這裡多補充一下如何使用 vue-cli 2。在官方文件中有提到，因為 vue-cli 3 和...
這一篇說實在的，現在的我還不能寫出有用的插件，所以這一篇筆記主要也是學習使用別人寫好的插件。 使用插件 Vue.use('PluginName', { //...
前言 今天要介紹的Getter，我們其實可以把它想像成Vue中的computed屬性。OK，那我們就開始吧！ Vuex Getter 介紹 使用時機：昨天我們介...
本文同步刊載於Andy's Blog 前言 昨天介紹了props.sync方法，今天我們來介紹另外一種元件的溝通方式。event bus(老司機XD)。 開...
今天練習的主題是用Vue實現列表的展開與隱藏功能會分為兩個範例讓大家做演練 範例一 先將isShow默認為false接著在function內判斷當前的列表是否...
前言 目前已經將元件內容大致上介紹完了，那我們今天就要先來介紹Vue CLI2吧！開始前我們先來認識何謂Vue CLI吧！ 什麼是Vue CLI? 基於Webp...
本文同步發表於Andy's Blog 前言 先前我們介紹到元件與元件之間的溝通方式之ㄧ：event bus，可以透過向bus發送事件與訂閱事件來將元件從原本...
Watch 監聽屬性 今天來介紹監聽 watch 的用法，這個可以讓我們監聽某個值，而當這個值有更動的時候，就去執行某些事情，請看下面範例： <!-- 這...
本文同步發表於斜槓女紙部落格：Day4 新手村的探險：專案環境設定和指令(Directives) 嗨！今天終於要打開VSCode準備開始撰寫專案了！先讓大...
本文同步發表於斜槓女紙部落格：Day2 了解你的敵人：Vue.js是什麼？ 首先，我大膽假設證，在看文章的你知道JavaScript是什麼東東。 什麼？你...
新增路由路徑 今天要來介紹如何新增路由路徑，並且如何切換頁面，馬上就來看範例吧！ src/components/Page.vue //檔案位置 <tem...
本文同步發表於斜槓女紙部落格：Day27 Vue CLI專案實作(一)：新增路由路徑及首頁banner 嗨！延續昨天的進度，今天要來試著調整首頁畫面，將原...
這篇是透過網路教學資源自我學習，並將學到的東西做個紀錄主要是在說明各個component中(XXX.vue 獨立分割的component)如何透過Vuex來存...
製作巢狀路由 昨天介紹如何新增路由及路由連結，今天再來更深入一點點，就是製作巢狀路由，在切換元件的時候，如果只想切換部份內容，就可以使用巢狀路由的方式，馬上來看...
在Vue中，如果我們需要綁定屬性就可以用到v-bind，是不是有對這個指令有印象啊，我們在Day 14的時候有大略提到，這幾天再來特別介紹v-bind用在cla...
前一篇說到 該怎麼寫 data 的資料，找回雙向綁定機制 !!!這邊先小小的補充一下 XD 在 Options API 我們 data 裡定義到的東西都可以被...
為什麼要設定路由呢？ 過去的網頁大多是 Multi Page Application(多頁式應用程式)，一個網頁畫面對應到一個網址，當切換一個網址就換開啟一份...
本文同步發表於Andy's Blog 前言 在介紹slot之前，我們必須先瞭解一個觀念：編譯作用域我們先來看個範例codepen連結 <div id=...
Vue：昨日講述了基本的Route設定後，今天我們再來看看巢狀路由吧！ 對於頁面上的切換，是很容易透過Route做到的。但有沒有可能，會需要將頁面某一部分，作為...
上一篇提到了 v-bind 的屬性綁定，今天就來提更多的屬性綁定的方法。 Class 與 Style 的綁定 我們先來看一個範例： <!-- 這是HTML...
建立虛擬屬性-由狀態組合而成 從 文件上面看 計算屬性的結果會被緩存，除非依賴的響應式屬性變化才會重新計算。注意，如果某個依賴(比如非響應式屬性)在該實例範疇...
本文同步發表於斜槓女紙部落格：Day1 前言：頭腦一熱就… 故事是這樣開始的 嗨！我是鍾小呆。靠著自學自修，繼踏入設計坑之後，又邁入前端坑，目前是一個前端...
首先我們要先安裝 Vue RouterVue Router 安裝參考資訊先在終端機輸入 $npm install vue-router --save接著我們就要...
前面有提到屬性綁定，在這裡我來介紹事件綁定及資料綁定，就讓我們開始吧！ 事件綁定 v-on 在網頁上，常常會有點擊、輸入資料等的互動事件，而如果你對 JavaS...
上一篇介紹了如何用 CDN 的方式使用 Vue，然後建立一個 Vue 的應用程式，接下來幾天會介紹在 Vue 裡常用的一些語法。 屬性綁定：v-bind 能夠將...
chunwen
Celeste
Magisheng
鍾小呆
ㄆㄩ
gior__ann
EdwardXiong
Jerry Huang
iThome鐵人賽
看影片追技術