技術 Day : 12.5 Pinia Options API vs Composition API 差異比較

前言 昨天我們已經在魔法書院裡完成了 Pinia 的 Composition API 咒語。今天要召喚另一種魔法陣：Options API 風格！ 在開始之前，...

技術 Day 12 : 可靠的中央行政單位：Pinia Getters / Setters

前言 有時候使用者（祕書）會拿到一份大訂單，想直接覆蓋整個訂單列表，再繼續點其他飲料。 為了支援這種情境，我們把訂單的「衍生統計」與「批次匯入邏輯」集中到 Pi...

技術 Day11：中央魔島書院 – 共享的 store (Pinia)

前言：為什麼需要「中央魔島」來管理資料 到目前為止，我們的飲料系統所有資料都放在 App.vue，再一層一層傳下去（Single Source of Truth...

技術 在 Vue 過氣前要學的第二十四件事 - 蟹老闆你有感覺了嗎 / 跨頁表單驗證 ( 上 ) / Pinia

前言 在此篇章中我們將會帶到如何使用狀態管理工具 + 驗證工具 來實現跨頁表單驗證的功能讓各位在實作中了解何為狀態管理，驗證的時機，以及還有什麼工具可以做延伸閱...

技術 【Pinia】專案使用 Pinia 取代 mitt 紀錄

在學習 Pinia 之後，我便決心為我的舊專案導入狀態管理於是我挑了我之前做的虛構電商網站來導入 Pinia 為什麼要使用 Pinia 在使用 Vue.js 開...

技術 【Pinia】在store中調用其他store的資料

【前言】本系列為個人前端學習之路的學習筆記，在過往的學習過程中累積了很多筆記，如今想藉著IT邦幫忙這個平台做整理+再複習。本系列標題一律以【】標示該篇文章主要涉...

技術 [ DAY26 ] Nuxt 3 進階技巧：Pinia、API 整合、Loading 元件

嗨！今天要跟大家分享的是如何在 Nuxt 3 專案中運用 Pinia 這個強大的狀態管理工具，並且實作一個客製化的 Loading 元件。無論你是剛接觸 Vue...

技術 如何不要那麼狼狽的串接各種甲方的SSO

本屆 #JCConf 邀請到 Rhys 分享「如何不要那麼狼狽的串接各種甲方的SSO」 講題簡介：隨著資安意識的提升，大部分具規模的甲方公司開始有更成熟的資案...

技術 DAY 15 - 輕鬆入門 Pinia 狀態管理工具

DAY 15 - 輕鬆入門 Pinia 狀態管理工具 Pinia 狀態管理工具 接著我們來嘗試運用 Pinia 狀態管理工具，Pinia 官方文件也有提供...

技術 DAY 14 - 狀態 (State) & 狀態管理工具

DAY 14 - 狀態 (State) & Pinia 狀態管理工具 今日介紹 Vue.js 狀態及狀態管理工具，這篇比較偏觀念我們會先從基本概念...

技術 Nuxt3+Pinia好甜-D27

Pinia這顆鳳梨有夠甜 Pinia是Vue官方推薦的狀態管理工具，雖然官方列出一大堆好處，但對菜鳥我來說目前的好處是：沒有mutations其他好處如下，待我...

技術 Day 26: 在 Vue router - Navigation Guard 中使用 Pinia store 的小眉角

前言 在 route 中使用 Pinia store 時，不同的 route guard 常常會需要用到同一個 store，我一開始想要少寫一點程式碼XD，減少...

技術 Day 25: 來發 API 吧！Pinia 語法學完馬上用

前言 在 Day 21: 來發 API 吧！Async Composition API setup() 中，是在元件準備渲染時，才在 setup 內發 API...

技術 Day 24: Before Pinia - 什麼是狀態(state)？為什麼需要狀態管理器？

前言 Vue 文件常常出現 "state" 這個單字，像是在 Reactivity Fundamentals 篇章中，會用 "st...

技術 Day11 前端頁面狀態管理 - Pinia

選單位置記憶 拆完頁面後，我們來解決選單項目位置的問題，原先的做法是每個頁面去手動變更class，讓當前的頁面選單會有高亮反白的顯示，這個動作如果每個頁面都要做...