前言 前面我們已經把 Vuex 的特性都解說完畢，應該對 Vuex 有初步的了解，但是如果沒有實作我們還是沒有辦法很熟悉，官方這邊提供了一個購物車的範例，我們就...
實例 Component Dropdown 許多細節都沒有完成，但時間緊迫，還是寫個大概就好。先附上程式碼，內容代補。 HTML: <div id=&q...
Component 延續前一天的內容 html #root h1 {{title}} h2 {{subtitle}} viwer js(L...
大致了解Vue的一些比較重要特色之後，再來我們來看看怎麼建置Vue的環境與專案，要開始進行實作部分了。 建立環境 開始之前，電腦需要有Node.js環境與NPM...
Component 簡介 在Day2：用七個官方範例初步認識 Vue.js已經有看過 Component 的範例。Component 在 Vue 中扮演很重要...
這次將介紹v-on的用法 v-on 用法是相當單純的，跟一般html5的onclick,onselect...等雖然其實差別不大，不過v-on的功能卻更強大，用...
你可以用 v-model 指令建立雙向數據綁定，在 Day2 的範例 06 - Form Input Bindings 已經使用過了。 範例回顧 Day2：...
認識Virtual DOM DOM(Document Object Model)的中文翻成**「文件物件模型」**，是HTML、XML、SVG文件可以使用的一組...
認識Instance Lifecycle與Instance Lifecycle Hooks 上圖為官網所繪製的Instance Lifecycle(生命週期)...
這次將介紹v-for,v-if,v-bind的用法 這次使用這筆資料來當作練習 fruits=[ { "fruit"...
Event Handling 可以用 v-on 指令監聽 DOM 事件，並在觸發時執行一些 JavaScript 代碼。 v-on 當 button Gree...
嚴格模式 Strict Mode 開啟嚴格模式只需要在建立 store 時傳入 strict: true 。 const store = new Vuex.S...
這次要介紹的部分是vue的開頭 首先決定vue要作用的區塊在el中定義生效的element var vm = new Vue({ el: "#ro...
Web元件化系統是Vue.js一個很重要的概念，我們使用官網提供的一張圖來做詳細解釋 上方右圖是一個樹狀結構，Vue.js嚮往的就是先建立好根實體(Vue I...
插件（Plugin） Vuex 的 store 接受 plugins 選項，這個選項露出每個 mutation 的鉤子 (hook)， Vuex 插件就是一個函...
List Rendering v-for with an Array of Object <ul id="app"> &l...
今天是鐵人賽第 10 天，我開始了另一個自我挑戰賽，題目為「三十天學 LodashJS」，也是不知道哪來的勇氣發佈自己寫的糞Code在網路上。我認為要多認識強者...
什麼是Vue.js？ 在這個網頁前端開發的工程，Google下的AngularJS與Facebook下的ReactJS，因為將前端的開發系統化，開發上比較方便...
在 Vue 中，綁定樣式分為 Binding HTML Classes 或是 Binding Inline Styles。通常為了分離 HTML 和 CSS，...
Watch 雖然在大多數情況下，Computed 更合適，但有時仍需要使用 Watch。 Watch vs Computed 附上 fiddle (https...
Filters Vue.js 允許自定義過濾器，過濾器分為本地和全域。使用方法分為兩種： 模板運算後方加上管道符號| {{ value | filter...
本文同步發佈於：勇者鬥 Vue 龍 本文為 2019 鐵人賽 續篇 目前為止介紹了下面幾種事件監聽的時機： 元素上使用 v-on 監聽原生事件 父組件...
接下來的幾天會分別介紹四個屬性，並互相比較倆倆之間差異和使用時機。 computed methods filters watch Computed 如果在...
連續寫了 Vue Instance, Lifecycle Hook, Virtual DOM 有點快要腦中風，今天就先回到寫幾個基礎範例喘息一下。至於執行結果...
今天還是一樣不太想開始寫Code，不想面對接下來的26天，三十天是很漫長的一個月... 在網路上可以找到許多的文章在介紹Vue，Vue的發音跟View一樣，簡單...
概述 DOM 是文檔對像模型(Document Object Model)的簡寫，在瀏覽器中我們可以使用 js 來操作 DOM，但是這樣的操作性能很差，於是...
Actions Actions 類似於 mutations，但仍然有些不同： Action 提交（commit）的是 mutations ，而不是直接變更 s...
Vue Instance 每個 Vue 的應用都是通過 new Vue() 來建立 Vue Instance 建立 Vue Instance 下面建立了一個名...
Mutations 提交 mutations 是改變 Vuex 中 store 的唯一方式。 mutations 非常類似於組件中的事件（event），每個 m...
非常偷懶的把官方介紹七個範例照打，目的在於粗略了解 Vue 在幹麻。 可以點擊各個範例的 fiddle 連結自行修改和觀看結果。 Vue example 01...
Nomi Su
HunterLiu
Eric
Syuanhahaha
掰掰工程師
iThome鐵人賽
看影片追技術