iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

Vue.js 進階心法 系列

對於自己這兩三年以來使用 Vue.js 的常見的實踐方式整理,並且結合前端框架與常見的程式設計觀念,解釋這些做法與觀念之間的關係、如何提昇開發經驗....等內容,分享一部份常見的專案實作方式,也有助於在好想工作室給學員有一個較好從框架語法熟悉之後,可以銜接到管理較多複雜頁面的大型系統時的摸索期。

鐵人鍊成 | 共 30 篇文章 | 84 人訂閱 訂閱系列文 RSS系列文 團隊好想工作室V5.0
DAY 21

表單攻略前準備

這需要一個完整的例子。 我先依照先前講的把程式碼先準備好 先看畫面 準備了兩個頁面: User, Users為了示範上面用一個 nav 來切換。 切換到 Us...

2021-10-06 ‧ 由 Chris 分享
DAY 22

用 event 來準備傳給後端的 data

今天來將畫面做好,我們面對的資料長這樣。 需求: 通常一個使用者的 form 表單是用在新增/編輯資料上面。 我們用一個小小的例子,一步一步的完整帶你看看,除了...

2021-10-07 ‧ 由 Chris 分享
DAY 23

拆掉 v-model + computed get/set 到 vuex

為什麼要特別寫 Form 表單攻略呢?因為這是使用者可以輸入資料的常見途徑,一種可以「寫入」資料的方式。 為了使用者可以將資料好好的寫入,單一資料流安排了一系列...

2021-10-08 ‧ 由 Chris 分享
DAY 24

新增表單/編輯表單,共用?或分開?

目前我們寫好了一個新增的畫面 需求 接下來,常見的需求是,人員的新增之後是人員的編輯。 新增用的畫面 編輯用的畫面 假設編輯時,只能換頭貼,不能改名字的畫面...

2021-10-09 ‧ 由 Chris 分享
DAY 25

表單: 處理物件型資料的畫面

以一個這樣的表單為例 <UserForm :data="data" @update:firstName=&quo...

2021-10-10 ‧ 由 Chris 分享
DAY 26

表單處理 Object 裡的 Object

今天來看看一個常見問題。 { first_name: 'chris', last_name: 'wang', email: 'chris@goodi...

2021-10-11 ‧ 由 Chris 分享
DAY 27

表單處理 Object 裡的 Array

今天來看看一個常見問題。 { first_name: 'chris', last_name: 'wang', email: 'chris@goodi...

2021-10-12 ‧ 由 Chris 分享
DAY 28

後端說修改時只需要送「有修改的欄位」過來

今天來介紹一個,因為後端提出這個需求。要接 PATCH API 而產生的做法。 如果都是 PUT 就不用這麼做了。 要修改的地方 store/user/in...

2021-10-13 ‧ 由 Chris 分享
DAY 29

表格元件共用攻略

前面講完表單這樣常見又複雜的製作方式,其實在對付的是一種「以物件為根的」資料結構。並且同時又處理掉了物件的物件,以及物件的陣列。那麼所有的表單其實就沒有什麼好害...

2021-10-14 ‧ 由 Chris 分享
DAY 30

完賽!YA!關於 Vue.js 進階心法系列

其實原本不是要叫這個名字的。原本要叫《官網沒教你的「如何把 Vue 寫好」》但是太狂了,竟然敢代替官網教你寫 Vue.js,後來想叫《Chris 的 Vue.j...

2021-10-15 ‧ 由 Chris 分享