本文同步發表於斜槓女紙部落格：Day18 閒不下來的史萊姆(一)：將房間列表改用x-template 建立元件 鐵人賽進展到今天，默默地也快突破20天。前...
在以往我們在字串的組合上會比較冗長，如下: const people = [ { name: '小明', friends: 2 },...
歐歐歐，竟然已經到第29天了，時間真的是咻咻咻就過了呢!明天就要結束了，真是感傷(☍﹏⁰) (解脫了ε٩(๑> ₃ <)۶з)今天跟昨天一樣來講講c...
昨天講了條件渲染，今天來講列表渲染(List Rendering)吧!! v-for 當我們在頁面上綁定資料時，遇到一些重複、複雜的data時(像是array、...
最近又再重複的溫習了 Vue 的 component，希望能重新幫自己整理思緒 component 俗稱元件，在網頁我們每一個區塊內容都可以封裝成一個獨立的元件...
在上一篇中寫了關於陣列的做法假如今天我們將陣列改成物件，該怎麼去實現它呢？先給一個全域值： const person = [ { name: "J...
初心 寫code開始，義大利麵到框架，後端碰到前端。為什麼到現在才寫Vue2呢？最主要的想法，是想把這個技術做個梳理，自學到哪？最後放棄的時候究...
在 Vue3 中我們可以使用 Options API 或是 Composition API 選擇一種方式來撰寫，下面來看看甚麼是 Options API ? 甚...
昨天講了class的綁定，今天換來講style (ﾉ◕ヮ◕)ﾉ*:･ﾟ✧ 綁定Style v-bind:style綁定的方式跟昨天的class很像。Style...
動態切換元件 今天來點輕鬆的，其實是我最近比較累所以沒辦法打太多東西，所以來介紹一個簡單的元件動態切換的方式，之前有使用動態的方式來切換 className 還...
本文同步發表於斜槓女紙部落格：Day17 萬丈高樓平地起(5)：元件間的溝通橋樑Props(2) 嗨！承接昨天的內容，今天要繼續和大家聊props的一些眉...
計算屬性 Computed 今天來介紹的是 computed 這個方法，能夠直接將結果存到變數之中，並且是可以直接使用的，直接來看下面的範例會比較清楚唷！ &l...
Vue.set Vue.js 在初始化實例時將屬性轉為 getter/setter，所以屬性必須在 data 對像上才能讓 Vue.js 轉換它，才能讓它是響...
晴
‧
2019-09-28
箭頭函式和普通函式之間的區別 箭頭函式並沒有自己的 this this 會往上找到最近的函數主體作為物件 this 指向定義時所在的物件，而不是呼叫時所在的物...
回顧30天，也讓我回憶了今年從金融業被抓去做開發工程師的日子。這30天中，講述了Vue的基本介紹、性能比較，也依據Vue的特性， 實作出許多app。 當然，雖...
身處金融業的我，從未想過有天還能在工作上，返回開發工程師的行列。一直以來，對於JS的喜愛依舊不減，假日時，偶爾還會開著電腦，寫寫JS。但對於框架語言，從未接觸。...
Vue 官方所提供的路由，由於使用vue2，Vue Router 版本選擇v3。 安裝 // npm npm install vue-router 應用 新...
蘇
‧
2021-09-22
這裡來介紹在 Vue 動態加上 class一樣先把 Vue 的架構先撰寫出來，而目標是想點擊按鈕時會在 .box 自動加上 rotate 這個 class，再點...
JavaScript 學得差不多了，覺得應該可以開始 Vue 看看了但在 Vue 之前要先引入它 。 在引入它之前，還有幾個要下載的東西： Vue Devt...
Vue：對於昨天全局與局部的基本了解後，今天我們利用一個實例，來解一下組件的好處吧~ 首先，先看一個基本的網頁結構：一般來說，網頁中一定會有共用的部分。以上圖為...
今天是三天連假的第一天，實體上課真的太累了，一不小心睡到下午诶嘿(๑´ڡ`๑)連假過完鐵人也差不多完成了!時間真的過的飛快啊，今天來講講vue的過濾器，雖然在這...
唉呀，今天再一篇v-for，不知道v-for分兩篇會不會覺得太灌水，但我還是分兩篇了✧*｡٩(ˊᗜˋ*)و✧*｡ Key 維護狀態 當Vue正在更新使用v-fo...
const Frieza = '弗利沙' const GinyuTeam = { Ginyu: '基紐', Jeice: '吉斯', burter:...
元件插槽 Slot 我們會將需要重複使用的區塊建立成元件，這樣可以方便我們重複使用，但是如果遇到我需要替換部份內容的時候，該怎麼辦呢？難道要再新建一個元件嗎？答...
動態切換 className 今天來介紹一點運用的範例，這是關於是件綁定跟屬性綁定的運用，如果對事件綁定 ( v-on ) 和屬性綁定 ( v-bind )還不...
為什麼選擇建立 header component 呢？ 網站各個頁面都會共用 固定版型而且不需要傳入動態的資料，不會有傳接資料報錯的問題 開始建立第一個元件...
沃嗚!鐵人倒數3天了，我們離完賽就差一顛點啦，我們今天來講講components吧~繼續gogogo (｢･ω･)｢ Component簡介 Vue compo...
Vue 主要架構 此圖片來源 Vue官方網站 建立compoent // Define a new component called todo-item Vue...
在前面我們已經了解了元件，現在我們要來多加說明 props 這個屬性props 是由外而內傳遞資料所使用的屬性有時候我們傳遞的資料也許是需要數值型態來計算的，這...
準備好之後，接下來我們要來引入 Bootstrap 套件了，參考 鐵人賽Day28 - Vue Cli 我們除了可以在 App.vue 的 style 引入 B...
鍾小呆
Jerry Huang
ㄆㄩ
gior__ann
Magisheng
EdwardXiong
iThome鐵人賽
看影片追技術