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

1 Like 0 留言 7840 瀏覽

技術 Element UI-[Select] 預設值設定

遇到問題在做生日的年月日時，因為我們接觸的客群年齡層大概是民國 40~60 年的人，所以希望可以把“年”這個的預設值調整成西元 1971 年、民國 60 年...

LucyLiou ‧ 2019-03-15

0 Like 1 留言 9084 瀏覽

技術 Element UI-[Table] 篩選資料

遇到問題想要透過 Input 來篩選 Table 裡面的資料解決方法 Element UI 很方便直接使用 Vue 的 Scoped slot...

LucyLiou ‧ 2019-03-14

0 Like 0 留言 7332 瀏覽

技術 Element UI-[Table] 欄位文字太長解決方式

遇到問題上班時會遇到一些小問題，也透過這樣一點一滴的把自己學的分享給大家，如果有誤歡迎大家指正 Table 欄位裡面文字過長問題解決方法一一...

LucyLiou ‧ 2019-03-14

0 Like 1 留言 1533 瀏覽

鐵人賽自我挑戰組 DAY 30

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 31 篇

技術 Day 30 : Vuex 計數器範例 - 2

Vuex 計數器範例 - 2 今天來把昨天的計數器的範例整理成正確的資料結構，如果你還沒完成昨天的範例的話，建議先完成一下，今天的內容才會比較看得懂唷！物件展...

Magisheng ‧ 2018-10-30

0 Like 0 留言 2963 瀏覽

鐵人賽自我挑戰組 DAY 29

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 30 篇

技術 Day 29 : Vuex 計數器範例

Vuex 計數器範例相信昨天介紹完了 Vuex 後還是會有很多人不知道該如何使用，今天就用實際範例來介紹 Vuex 究竟該如何使用，直接看下面的範例吧！安裝...

Magisheng ‧ 2018-10-29

0 Like 0 留言 1684 瀏覽

鐵人賽自我挑戰組 DAY 28

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 29 篇

技術 Day 28 : Vuex

Vuex 接下來要來介紹的是 Vuex，在這我先附上官方文件。什麼是 Vuex？ Vuex 可以用來管理前端網站的資料狀態，以集中式的方式管理儲存所有元件的狀...

Magisheng ‧ 2018-10-28

0 Like 0 留言 4470 瀏覽

鐵人賽自我挑戰組 DAY 27

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 28 篇

技術 Day 27 : Event Bus

Event Bus 為了接下來幾天的 Vuex，今天先來講一下什麼是 event bus，之前有說過在元件之間的溝通，父元件往內傳資料是用 props，而子元件...

Magisheng ‧ 2018-10-27

0 Like 0 留言 2806 瀏覽

鐵人賽自我挑戰組 DAY 26

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 27 篇

技術 Day 26 : Vue - Axios

Vue-Axios 今天來介紹的是，該如何去介接 API，也就是使用 AJAX 取得資料，以前官方推薦的是 Vue-resource，現在則是有 Axios 取...

Magisheng ‧ 2018-10-26

1 Like 0 留言 2436 瀏覽

鐵人賽自我挑戰組 DAY 25

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 26 篇

技術 Day 25 : 切換路由方法

切換路由方法之前有提到切換路由的方法是使用 router-link 來切換，今天我們來介紹另一種不同的方式，這裡附上官方文件 API 參考，搭配官方文件的介紹...

Magisheng ‧ 2018-10-25

0 Like 0 留言 1668 瀏覽

鐵人賽自我挑戰組 DAY 24

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 25 篇

技術 Day 24 : 同一路徑載入多個頁面元件

同一路徑載入多個頁面元件現在我們已經能夠靠點擊連結來切換我們想要訪問的路徑，並且利用切換頁面元件的方式達到切換頁面的效果，是不是越來越有單頁式應用程式的感覺了...

Magisheng ‧ 2018-10-24

0 Like 0 留言 1951 瀏覽

鐵人賽自我挑戰組 DAY 23

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 24 篇

技術 Day 23 : 製作巢狀路由

製作巢狀路由昨天介紹如何新增路由及路由連結，今天再來更深入一點點，就是製作巢狀路由，在切換元件的時候，如果只想切換部份內容，就可以使用巢狀路由的方式，馬上來看...

Magisheng ‧ 2018-10-23

1 Like 1 留言 2017 瀏覽

鐵人賽自我挑戰組 DAY 22

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 23 篇

技術 Day 22 : 新增路由路徑

新增路由路徑今天要來介紹如何新增路由路徑，並且如何切換頁面，馬上就來看範例吧！ src/components/Page.vue //檔案位置 <tem...

Magisheng ‧ 2018-10-22

0 Like 0 留言 4316 瀏覽

鐵人賽自我挑戰組 DAY 21

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 22 篇

技術 Day 21 : Vue Router

Vue Router 透過 Vue Router 我們可以製作出多視圖的單頁應用程式也就是 SPA，現在先讓我們看看該怎麼使用吧！如何使用這邊先用 vue-...

Magisheng ‧ 2018-10-21

0 Like 0 留言 2206 瀏覽

鐵人賽自我挑戰組 DAY 20

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 21 篇

技術補充： Vue-cli 2

Vue-cli 2 其實我還是比較習慣使用 vue-cli 2，所以這裡多補充一下如何使用 vue-cli 2。在官方文件中有提到，因為 vue-cli 3 和...

Magisheng ‧ 2018-10-20

0 Like 0 留言 8149 瀏覽

鐵人賽自我挑戰組 DAY 20

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 20 篇

技術 Day 20 : Vue-cli 建立開發環境與新增專案

Vue-cli 3 建立開發環境與新增專案基礎介紹基本上就到一個段落，接下來最後的這幾天會介紹一些 Vue 的生態。首先介紹該如何建立 Vue 的開發環境與新...

Magisheng ‧ 2018-10-20

0 Like 0 留言 1514 瀏覽

鐵人賽自我挑戰組 DAY 19

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 19 篇

技術 Day 19 : Transition 漸變

Transition 漸變 Vue 有封裝好的 transition 元件可以使用，可以讓我們在撰寫漸變特效時更方便，而且我們可以自定義漸變的樣式類別，設計出屬...

Magisheng ‧ 2018-10-19

0 Like 0 留言 5960 瀏覽

鐵人賽自我挑戰組 DAY 18

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 18 篇

技術 Day 18 : Vue extend

Vue extend 當我們有數個元件的內容很相近，只有少部分內容不一樣的時候，我們可以使用 extend 來建立重複的部分，來看下面範例： <div i...

Magisheng ‧ 2018-10-18

0 Like 0 留言 1170 瀏覽

鐵人賽自我挑戰組 DAY 17

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 17 篇

技術 Day 17 : 動態切換元件

動態切換元件今天來點輕鬆的，其實是我最近比較累所以沒辦法打太多東西，所以來介紹一個簡單的元件動態切換的方式，之前有使用動態的方式來切換 className 還...

Magisheng ‧ 2018-10-17

0 Like 0 留言 1117 瀏覽

鐵人賽自我挑戰組 DAY 16

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 16 篇

技術 Day 16 : 元件插槽 Slot

元件插槽 Slot 我們會將需要重複使用的區塊建立成元件，這樣可以方便我們重複使用，但是如果遇到我需要替換部份內容的時候，該怎麼辦呢？難道要再新建一個元件嗎？答...

Magisheng ‧ 2018-10-16

1 Like 0 留言 1676 瀏覽

鐵人賽自我挑戰組 DAY 15

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 15 篇

技術 Day 15 : emit 向外層傳遞資訊

emit 向外層傳遞資訊昨天我們提到了如何將資料由外層傳向內層，用 props 的方式可以將資料由外向內傳遞，那如果我們想要將內層的資料向外層傳遞時該怎麼做呢...

Magisheng ‧ 2018-10-15

1 Like 0 留言 1282 瀏覽

鐵人賽自我挑戰組 DAY 14

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 14 篇

技術 Day 14 : Props 特性，由外向內的資料傳遞

Props 特性，由外向內的資料傳遞元件與元件之間的資料都是各個獨立的，所以才不會互相干擾，如果遇到需要由父層傳遞資料給子層的時候，我們可以使用 props，...

Magisheng ‧ 2018-10-14

0 Like 0 留言 1360 瀏覽

鐵人賽自我挑戰組 DAY 13

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 13 篇

技術 Day 13 : 元件 Components

全域註冊昨天介紹了 Vue 中非常重要的元件，今天我們就來看看元件究竟要怎麼使用吧！首先來是全域註冊的方式，直接來看範例： <div id="...

Magisheng ‧ 2018-10-13

0 Like 0 留言 1303 瀏覽

鐵人賽自我挑戰組 DAY 12

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 12 篇

技術 Day 12 : 元件 Components 基礎介紹

元件 Components 基礎介紹元件的概念在 Vue 中是非常重要的一個環節，Vue 應用程式都是從建立根實體開始，之後再一個一個元件搭建上去，而透過元件...

Magisheng ‧ 2018-10-12

1 Like 0 留言 1509 瀏覽

鐵人賽自我挑戰組 DAY 11

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 11 篇

技術 Day 11 : 生命週期 Lifecycle

Vue Instance Vue 的生命週期是一個相當重要的觀念， Vue 應用程式是從 Vue 建構式( Vue constructor )建立根實體( Vu...

Magisheng ‧ 2018-10-11

0 Like 0 留言 1557 瀏覽

鐵人賽自我挑戰組 DAY 10

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 10 篇

技術 Day 10 : Filter 過濾

Filter 過濾今天來介紹過濾 filter，過濾顧名思義就是能夠將資料在顯示之前作前處理的方式，直接來看範例會比較清楚。 <div id=&quot...

Magisheng ‧ 2018-10-10

0 Like 1 留言 2049 瀏覽

鐵人賽自我挑戰組 DAY 9

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 9 篇

技術 Day 9 : Watch 監聽屬性

Watch 監聽屬性今天來介紹監聽 watch 的用法，這個可以讓我們監聽某個值，而當這個值有更動的時候，就去執行某些事情，請看下面範例： <!-- 這...

Magisheng ‧ 2018-10-09

1 Like 0 留言 1165 瀏覽

鐵人賽自我挑戰組 DAY 8

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 8 篇

技術 Day 8 : Computed 計算屬性

計算屬性 Computed 今天來介紹的是 computed 這個方法，能夠直接將結果存到變數之中，並且是可以直接使用的，直接來看下面的範例會比較清楚唷！ &l...

Magisheng ‧ 2018-10-08

1 Like 0 留言 1210 瀏覽

鐵人賽自我挑戰組 DAY 7

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 7 篇

技術 Day 7 : 列表渲染

列表渲染在 Vue 中，我們會使用 v-for 來迭代陣列中的元素。下方我先在 Vue 的應用程式中建立一個陣列為 list ： new Vue({ el...

Magisheng ‧ 2018-10-07

0 Like 0 留言 1703 瀏覽

鐵人賽自我挑戰組 DAY 6

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 6 篇

技術 Day 6 : 條件渲染

條件渲染今天來介紹 v-if 和 v-show，並比較兩者之間的差異。 v-if 如果希望某些區塊在特定條件下才出現，就可以使用 v-if 、 v-else-...

Magisheng ‧ 2018-10-06

0 Like 0 留言 1113 瀏覽

鐵人賽自我挑戰組 DAY 5

Vue 學習筆記 - 讓你30天掌握 Vue 系列第 5 篇

技術 Day 5 : 動態切換 className

動態切換 className 今天來介紹一點運用的範例，這是關於是件綁定跟屬性綁定的運用，如果對事件綁定 ( v-on ) 和屬性綁定 ( v-bind )還不...

Magisheng ‧ 2018-10-05