iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
自我挑戰組

與Vue相遇 系列

對於JS的熱情,一直沒變。小時候拼命地使用DOM操作物件,直到框架語言的出現,改變了這個世界。
曾經也懷有一科工程師的夢,但誤打誤撞進入了金融行業。疫情的影響,使我不再當空中飛人,但也因為公司的需要,讓我重回了JS的懷抱。
曾經的它(ES6之前),還是那麼單純,與我那時的青澀相比,我倆真是天生一對。

如今,JS的改變(Vue),讓我更容易了解它的想法,就讓我娓娓道來,我們的相遇。

鐵人鍊成 | 共 30 篇文章 | 4 人訂閱 訂閱系列文 RSS系列文
DAY 11

Day011-腳手架介紹

透過Vue CLI的建立,在我們打開專案後,主要會看到三個資料夾及一部分非資料夾區塊。我們可以先從最主要的src資料夾來看:src資料夾為專案中最重要的一部分。...

2020-09-25 ‧ 由 EdwardXiong 分享
DAY 12

Day012-Lifecycle-Vue實體生命週期-了解你的夢中情人

與Vue相遇後,一開始其實有點懷疑vue的應用。但使用後,對她越來越著迷,這使我更想了解她。 每當我們使用vue時,有些步驟都會相對應的重複,例如創建Vue、建...

2020-09-26 ‧ 由 EdwardXiong 分享
DAY 13

Day013-Lifecycle-Vue實體生命週期-創建你的夢中情人

想起當初,第一次約她見面,是那麼輕鬆又好約。那一天,我開著我的車,直接到她公司樓下等。透過VS Code傳遞了訊息,而她的回應非常迅速。縱使之前沒見過我,我也...

2020-09-27 ‧ 由 EdwardXiong 分享
DAY 14

Day014-Component組件

Vue:隨著你使用vue的狀況,你更應該要了解元件模組化的概念。vue不但在資料上面有所規劃,他在元件模組化也有所強大,讓你可以輕鬆地管理好你的元件。在進行案例...

2020-09-28 ‧ 由 EdwardXiong 分享
DAY 15

Day015-Component組件-基本帳務系統實例

Vue:對於昨天全局與局部的基本了解後,今天我們利用一個實例,來解一下組件的好處吧~ 首先,先看一個基本的網頁結構:一般來說,網頁中一定會有共用的部分。以上圖為...

2020-09-29 ‧ 由 EdwardXiong 分享
DAY 16

Day016-Component組件-傳值(props和$emit)

Vue:我們透過組件,來模塊化我們的功能。我知道你很好奇,到底如何從根模塊,傳值給組件,使組件可以渲染資料於table中,對吧?如果,仔細觀察昨天的程式碼,你會...

2020-09-30 ‧ 由 EdwardXiong 分享
DAY 17

Day017-Vue Router介紹(一)基本介紹

Vue:還記得在Vue CLI建置專案時候,也有遇上Vue Router嗎?無論你是使用history mode或hash mode,設置路由,將可以導入到正確...

2020-10-01 ‧ 由 EdwardXiong 分享
DAY 18

Day018-Vue Router介紹(二)路由設定

Vue:設定基本路由,可以拆解成以下步驟: 定義模板 template 配置模板路線(routes)(每一條路線,都會對應到相應的component;而這邊的...

2020-10-02 ‧ 由 EdwardXiong 分享
DAY 19

Day019-Vue Router介紹(三)巢狀路由:

Vue:昨日講述了基本的Route設定後,今天我們再來看看巢狀路由吧! 對於頁面上的切換,是很容易透過Route做到的。但有沒有可能,會需要將頁面某一部分,作為...

2020-10-03 ‧ 由 EdwardXiong 分享
DAY 20

Day020-Vue Router介紹(四)動態參數:

Vue:在介紹基本設定、巢狀路由後,今天來說明一下動態參數對於Vue的使用。有時候,在設計文章與資料庫的對接,或者使用者的權限時,常常帶著id來進行動態參數。動...

2020-10-04 ‧ 由 EdwardXiong 分享