iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 1 留言 1427 瀏覽

鐵人賽自我挑戰組 DAY 30

每天來點 Vue.js 吧系列第 30 篇

技術每天來點 Vue.js 吧目錄&總結

tags: Vuejs 本次鐵人作為進入 Vue 3 的前的粗淺回顧，簡單介紹了 Vue 2 官網的內容，雖然有許多不足，中段開始時間調控上做的也不如預期，但在...

RURU Tseng ‧ 2020-10-15

0 Like 1 留言 1671 瀏覽

鐵人賽自我挑戰組 DAY 29

每天來點 Vue.js 吧系列第 29 篇

技術 Vue 動態組件

tags: Vuejs 動態組件 ✐ 動態組件可以幫助我們動態切換組件，例如在網頁的多標籤介面中常見到動態切換組件的需求，便是動態組件能幫忙的場景之一。使用...

RURU Tseng ‧ 2020-10-14

0 Like 1 留言 2025 瀏覽

鐵人賽自我挑戰組 DAY 28

每天來點 Vue.js 吧系列第 28 篇

技術 Vue slot：作用域插槽、具名插槽的縮寫

tags: Vuejs 作用域插槽 <slot> 內容在父模板編譯，基於 Vue 的定義，在父模板中編譯的內容訪問 parent scope，在子模...

RURU Tseng ‧ 2020-10-13

0 Like 0 留言 1319 瀏覽

鐵人賽自我挑戰組 DAY 27

每天來點 Vue.js 吧系列第 27 篇

技術 Vue slot：具名插槽

tags: Vuejs 具名插槽 ✐ 若是需要多個插槽，可以在 <slot> 中使用 name attribute，定義命名的插槽，可以定義具有多個...

RURU Tseng ‧ 2020-10-12

0 Like 2 留言 1087 瀏覽

鐵人賽自我挑戰組 DAY 26

每天來點 Vue.js 吧系列第 26 篇

技術 Vue slot：編譯作用域、後備內容

tags: Vuejs <slot> 是什麼？ ✐ Vue 中的 <slot> 是 Vue 內置的組件 build-in compone...

RURU Tseng ‧ 2020-10-11

0 Like 0 留言 3730 瀏覽

鐵人賽自我挑戰組 DAY 25

每天來點 Vue.js 吧系列第 25 篇

技術 Vue 透過 `$listeners` 在子組件特定元素上監聽原生事件

tags: Vuejs 監聽子組件原生事件 ✐ 當父組件需要接收子組件訊息、數據時，可以透過在子組件自定義事件達成，除此之外若是需要監聽子組件根元素原生...

RURU Tseng ‧ 2020-10-10

2 Like 1 留言 5271 瀏覽

鐵人賽自我挑戰組 DAY 23

每天來點 Vue.js 吧系列第 23 篇

技術對 Vue component 傳入非 Prop 的 attribute

tags: Vuejs Vue component 可以傳入 prop attribute 以及 non-prop attribute 兩種 attribute...

RURU Tseng ‧ 2020-10-08

1 Like 1 留言 10763 瀏覽

鐵人賽自我挑戰組 DAY 21

每天來點 Vue.js 吧系列第 21 篇

技術 Vue component 上該如何使用 v-model ？

tags: Vuejs v-model ✐ v-model 作用於表單元件上時，是雙向數據綁定的語法糖： <input v-model="n...

RURU Tseng ‧ 2020-10-06

0 Like 0 留言 2416 瀏覽

鐵人賽自我挑戰組 DAY 20

每天來點 Vue.js 吧系列第 20 篇

技術 Vue 自定義事件 - 拋出子組件數據

Props down, Event up ✐ Prop 是數據由父組件向子組件流動的單向數據流，也就代表子組件無法透過 Prop 更改父組件的數據（注意，盡量...

RURU Tseng ‧ 2020-10-05

0 Like 0 留言 1180 瀏覽

鐵人賽自我挑戰組 DAY 19

每天來點 Vue.js 吧系列第 19 篇

技術 How to find your passion as a Software Developer - Evan You

tags: Vuejs How to find your passion as a Software Developer ✐ 在連假的最後一天，一樣來一些輕鬆的...

RURU Tseng ‧ 2020-10-04

0 Like 0 留言 784 瀏覽

鐵人賽自我挑戰組 DAY 18

每天來點 Vue.js 吧系列第 18 篇

技術 Seeking the Balance in Framework Design

tags: Vuejs Seeking the Balance in Framework Design ✐ 在中秋連假倒數兩天的今天，作為放鬆，來分享之前看的...

RURU Tseng ‧ 2020-10-03

0 Like 0 留言 2176 瀏覽

鐵人賽自我挑戰組 DAY 17

每天來點 Vue.js 吧系列第 17 篇

技術 Vue component 父組件向子組件傳遞數據的方法 - Prop（下）

tags: Vuejs 前言 ✐ 上一篇中說明了透過 Prop，我們可以將父組件的值傳遞給子組件，這一篇中，我們會來看 Prop 的使用細節。命名規則 ✐ 在...

RURU Tseng ‧ 2020-10-02

0 Like 0 留言 2581 瀏覽

鐵人賽自我挑戰組 DAY 16

每天來點 Vue.js 吧系列第 16 篇

技術 Vue component 父組件向子組件傳遞數據的方法 - Prop（上）

tags: Vuejs 組件間的傳遞數據的方法 ✐ 在 Vue 之中，組件之間的數據並不共用，換句話說，組件之間若是需要傳遞數據，需要透過幾種方式進行：以下列...

RURU Tseng ‧ 2020-10-01

0 Like 0 留言 1907 瀏覽

鐵人賽自我挑戰組 DAY 15

每天來點 Vue.js 吧系列第 15 篇

技術 Vue components 組件的抽象概念 ✏︎

tags: Vuejs 組件的抽象概念 ✐ 註：下方 component 和組件一詞意思相同。 component 在 Vue 中是一個重要的概念，照...

RURU Tseng ‧ 2020-09-30

0 Like 0 留言 4747 瀏覽

鐵人賽自我挑戰組 DAY 14

每天來點 Vue.js 吧系列第 14 篇

技術 Vue 雙向數據綁定的語法糖 v-model ✔︎

很久以前做的 form 練習使用表單元件 <textarea>、<input>、<select> 時，通常需要用戶的...

RURU Tseng ‧ 2020-09-29

0 Like 0 留言 988 瀏覽

鐵人賽自我挑戰組 DAY 13

每天來點 Vue.js 吧系列第 13 篇

技術 v-for 列表渲染

tags: Vuejs v-for ✐ v-for 指令可以使我們方便的渲染 Array 成為列表，在渲染列表相關的 data 時十分方便，並且 v-for 除...

RURU Tseng ‧ 2020-09-28

0 Like 0 留言 1390 瀏覽

鐵人賽自我挑戰組 DAY 12

每天來點 Vue.js 吧系列第 12 篇

技術 Vue 事件處理

v-on 要對模板中的元素添加 Event Listener，Vue 提供 v-on 指令可以針對元素綁定 Event Listener，並在事件發生時調用...

RURU Tseng ‧ 2020-09-27

0 Like 0 留言 1660 瀏覽

鐵人賽自我挑戰組 DAY 11

每天來點 Vue.js 吧系列第 11 篇

技術 Vue Conditional Rendering 條件渲染

tags: Vuejs v-if ✐ v-if 指令可以決定是否渲染元素，該元素只有在填入的 expression 為 truthy 時會渲染。下方為簡單範...

RURU Tseng ‧ 2020-09-26

0 Like 0 留言 1991 瀏覽

鐵人賽自我挑戰組 DAY 10

每天來點 Vue.js 吧系列第 10 篇

技術 Vue Class Bindings

tags: Vuejs 樣式渲染畫面的呈現有時會因應資料的不同，產生不同的視覺樣式，而通常我們會使用 v-bind 指令動態渲染 HTML attribute...

RURU Tseng ‧ 2020-09-25

0 Like 1 留言 1092 瀏覽

鐵人賽自我挑戰組 DAY 9

每天來點 Vue.js 吧系列第 9 篇

技術 Vue computed 與 watch 差異

Fixing ... 若是文中有任何錯誤、錯字、想討論的內容，歡迎各位大大不吝鞭笞指正、交流分享，筆者不慎感激 ✦ ✦ ✦ ▶︎ 筆者 github：http...

RURU Tseng ‧ 2020-09-24

0 Like 1 留言 7495 瀏覽

鐵人賽自我挑戰組 DAY 8

每天來點 Vue.js 吧系列第 8 篇

技術 Vue computed 與 method 的差異比較

tags: Vuejs computed 與 method 的混淆在模板中要對資料計算或是轉換時，computed 與 method 往往能替我們做到同樣的事...

RURU Tseng ‧ 2020-09-23

0 Like 1 留言 5978 瀏覽

鐵人賽自我挑戰組 DAY 7

每天來點 Vue.js 吧系列第 7 篇

技術 Vue computed property `getter` 與 `setter` 的那些事

Computed Property ✐ 在 computed 中設置的 property 稱為 Computed Property 計算屬性，Computed...

RURU Tseng ‧ 2020-09-22

0 Like 0 留言 3219 瀏覽

鐵人賽自我挑戰組 DAY 6

每天來點 Vue.js 吧系列第 6 篇

技術 Vue template 模板語法

tags: Vuejs Vue template ✐ 還記得前一章節 option 裡的 template 嗎？Vue 提供開發者透過 template 聲明式...

RURU Tseng ‧ 2020-09-21

1 Like 2 留言 1612 瀏覽

鐵人賽自我挑戰組 DAY 5

每天來點 Vue.js 吧系列第 5 篇

技術 Vue instance 生命週期 ✦

tags: Vuejs Instance Lifecycle 生命週期 ✐ 介紹完如何使用 new Vue({...}) 建構 Vue instance 後，接...

RURU Tseng ‧ 2020-09-20

0 Like 0 留言 2338 瀏覽

鐵人賽自我挑戰組 DAY 4

每天來點 Vue.js 吧系列第 4 篇

技術一切的基礎：Vue instance

tags: Vuejs Vue reactivity system ✐ Vue 引入 data-driven view 的概念，一旦改動 data，與之相對應的...

RURU Tseng ‧ 2020-09-19

0 Like 0 留言 3477 瀏覽

鐵人賽自我挑戰組 DAY 3

每天來點 Vue.js 吧系列第 3 篇

技術工欲善其事，必先利其器 ⚙︎ Vue 開發環境建置

tags: Vuejs 如何開始使用 Vue ✐ Vue 一共提供三種不同的方式可供我們使用，依照使用情境的不同可以選擇不同的方式。方法適合場景...

RURU Tseng ‧ 2020-09-18

0 Like 3 留言 2256 瀏覽

鐵人賽自我挑戰組 DAY 2

每天來點 Vue.js 吧系列第 2 篇

技術 Vue 原來是法語？ Vue 的超簡短歷史介紹

tags: Vuejs TL;DR ✐ 要了解 Vue 的簡短歷史，筆者推薦可以自這部由 Honeypot 在 2020.02.24 發布的 Vue.js: T...

RURU Tseng ‧ 2020-09-17

技術 每天來點 Vue.js 吧 目錄&總結