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

0 Like 0 留言 3774 瀏覽

鐵人賽自我挑戰組 DAY 25

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

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

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

RURU Tseng ‧ 2020-10-10

2 Like 1 留言 5312 瀏覽

鐵人賽自我挑戰組 DAY 23

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

技術對 Vue component 傳入非 Prop 的 attribute

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

RURU Tseng ‧ 2020-10-08

3 Like 1 留言 881 瀏覽

鐵人賽 Modern Web DAY 30

實作經典 JavaScript 30 系列第 30 篇

技術 Day30: 完賽心得

第30天，不免俗要來寫個完賽心得雖然javascript-30還差個幾天，才能把全部的實例都做完但還是要給自己拍拍手，利用這30天養成了一個好習慣而且真的沒想到...

喬依司 ‧ 2020-10-08 ‧團隊自討苦吃三十天#像極了愛情

1 Like 0 留言 1209 瀏覽

鐵人賽 Modern Web DAY 29

實作經典 JavaScript 30 系列第 29 篇

技術 Day29: Event Capture, Propagation, Bubbling and Once

WES BOS系列影片Alex快速導讀系列影片今天比較偏觀念的講解主要是希望能較深入理解addEventListener()學習DOM的事件機制，包括事件捕獲...

喬依司 ‧ 2020-10-07 ‧團隊自討苦吃三十天#像極了愛情

1 Like 1 留言 10812 瀏覽

鐵人賽自我挑戰組 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 留言 2445 瀏覽

鐵人賽自我挑戰組 DAY 20

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

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

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

RURU Tseng ‧ 2020-10-05

1 Like 0 留言 1634 瀏覽

鐵人賽 Modern Web DAY 28

實作經典 JavaScript 30 系列第 28 篇

技術 Day28: Sticky Nav

WES BOS系列影片Alex快速導讀系列影片今天針對常用的Navbar做fix的狀態這真的是很常見的功能，可以立馬學起來 1.先抓出NavBar的位置，以及...

喬依司 ‧ 2020-10-06 ‧團隊自討苦吃三十天#像極了愛情

1 Like 0 留言 1329 瀏覽

鐵人賽 Modern Web DAY 27

實作經典 JavaScript 30 系列第 27 篇

技術 Day27:Speech Synthesis

WES BOS系列影片Alex快速導讀系列影片今天來認識 Web Speech API中的兩個功能一個是 SpeechSynthesisUtterance它包...

喬依司 ‧ 2020-10-05 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 1189 瀏覽

鐵人賽自我挑戰組 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

1 Like 0 留言 1013 瀏覽

鐵人賽 Modern Web DAY 26

實作經典 JavaScript 30 系列第 26 篇

技術 Day26: Follow Along Links

WES BOS系列影片Alex快速導讀系列影片今天的練習是用js控制滑鼠游標，當滑鼠游標到達當前的連結時，我們使用一個新的方法getBoundingClien...

喬依司 ‧ 2020-10-04 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 795 瀏覽

鐵人賽自我挑戰組 DAY 18

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

技術 Seeking the Balance in Framework Design

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

RURU Tseng ‧ 2020-10-03

2 Like 0 留言 1105 瀏覽

鐵人賽 Modern Web DAY 25

實作經典 JavaScript 30 系列第 25 篇

技術 Day25: Adding Up Times With Reduce

WES BOS系列影片Alex快速導讀系列影片今天的練習會用到reduce()還有用一些數學的運算，將秒數換算成時分秒然後又複習了一下dataset的用法事不...

喬依司 ‧ 2020-10-03 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 2206 瀏覽

鐵人賽自我挑戰組 DAY 17

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

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

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

RURU Tseng ‧ 2020-10-02

1 Like 0 留言 911 瀏覽

鐵人賽 Modern Web DAY 24

實作經典 JavaScript 30 系列第 24 篇

技術 Day24: Sort Without Articles

WES BOS系列影片Alex快速導讀系列影片今天要結合正規表達式跟sort()來做排序的功能作者這邊假設了一個情境就是我們拿到了一串樂團的清單，希望可以用樂...

喬依司 ‧ 2020-10-02 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 2614 瀏覽

鐵人賽自我挑戰組 DAY 16

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

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

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

RURU Tseng ‧ 2020-10-01

0 Like 0 留言 1937 瀏覽

鐵人賽自我挑戰組 DAY 15

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

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

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

RURU Tseng ‧ 2020-09-30

2 Like 0 留言 1870 瀏覽

鐵人賽 Modern Web DAY 30

到底要怎麼開始開發網站? --- 從入門到使用Vue, Firebase製作老闆交代的網站系列第 30 篇

技術【D30 - 期待與各位再次見面】前端學到暈島隆重閉幕!

恭喜各位如果是從之前一步一步走來的人~ 那你已經擁有了基本的前端工程師必備技能!! 前言我們在從一開始的那個地圖來看起，驗收一下我們這一路走來到底走過哪裡...

ryanyen2 ‧ 2020-09-30

3 Like 0 留言 1009 瀏覽

鐵人賽 Modern Web DAY 23

實作經典 JavaScript 30 系列第 23 篇

技術 Day23: Mouse Move Shadow

WES BOS系列影片Alex快速導讀系列影片今天的練習重點是抓取DOM容器的座標與mousemove事件我們要做一個文字陰影與滑鼠互動的效果要做出這個效果，...

喬依司 ‧ 2020-10-01 ‧團隊自討苦吃三十天#像極了愛情

2 Like 0 留言 872 瀏覽

鐵人賽 Modern Web DAY 22

實作經典 JavaScript 30 系列第 22 篇

技術 Day22: LocalStorage(二)

我們就必須使用LocalStorage來讓瀏覽器記住剛才輸入的資料紀錄完成後，同時將表單的回復成未輸入的狀態 localStorage.setItem('ite...

喬依司 ‧ 2020-09-30 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 4816 瀏覽

鐵人賽自我挑戰組 DAY 14

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

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

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

RURU Tseng ‧ 2020-09-29

2 Like 0 留言 1044 瀏覽

鐵人賽 Modern Web DAY 21

實作經典 JavaScript 30 系列第 21 篇

技術 Day21: LocalStorage(ㄧ)

WES BOS系列影片Alex快速導讀系列影片今天要來認識LocalStorage看不太懂的話，這裡也有一篇我覺得寫得很好理解的筆記可以參考localStor...

喬依司 ‧ 2020-09-29 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 1001 瀏覽

鐵人賽自我挑戰組 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 留言 1415 瀏覽

鐵人賽自我挑戰組 DAY 12

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

技術 Vue 事件處理

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

RURU Tseng ‧ 2020-09-27

2 Like 0 留言 812 瀏覽

鐵人賽 Modern Web DAY 20

實作經典 JavaScript 30 系列第 20 篇

技術 Day20: JS中引用與複製的差異(二)

今天針對物件來看引用與複製的差異先創造一個簡單的物件 const person = { name: 'Wes Bos', age: 80 }; 再製作...

喬依司 ‧ 2020-09-28 ‧團隊自討苦吃三十天#像極了愛情

2 Like 0 留言 908 瀏覽

鐵人賽 Modern Web DAY 19

實作經典 JavaScript 30 系列第 19 篇

技術 Day19: JS中引用與複製的差異(一)

WES BOS系列影片Alex快速導讀系列影片最一開始可以先試試看這兩段程式碼 let age = 100; let age2 = age; console....

喬依司 ‧ 2020-09-27 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 1673 瀏覽

鐵人賽自我挑戰組 DAY 11

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

技術 Vue Conditional Rendering 條件渲染

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

RURU Tseng ‧ 2020-09-26

1 Like 0 留言 2099 瀏覽

鐵人賽 Modern Web DAY 18

實作經典 JavaScript 30 系列第 18 篇

技術 Day 18 : 為網頁增加圖片動畫效果

WES BOS系列影片Alex快速導讀系列影片今天要為靜態的文章，添加一些圖片進場的動畫效果練習抓取螢幕與圖片的長度，進而控制圖片的進場時間。 1.先抓出需要...

喬依司 ‧ 2020-09-26 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 2015 瀏覽

鐵人賽自我挑戰組 DAY 10

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

技術 Vue Class Bindings

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

RURU Tseng ‧ 2020-09-25

2 Like 0 留言 2181 瀏覽

鐵人賽 Modern Web DAY 25

到底要怎麼開始開發網站? --- 從入門到使用Vue, Firebase製作老闆交代的網站系列第 25 篇

技術【D25 - Vuex】給你一個方便的儲藏室!!

Vuex是一個非常方便且非常好用的的開發vue工具，他有點類似於react的redux~ 今天簡短介紹一下Vuex，明天就可以來實踐今天講到的東西囉! 甚麼...

ryanyen2 ‧ 2020-09-25

0 Like 1 留言 1101 瀏覽

鐵人賽自我挑戰組 DAY 9

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

技術 Vue computed 與 watch 差異

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

RURU Tseng ‧ 2020-09-24