app.config.globalProperties 全局 filter 使用方法
在幫舊專案由 Vue2 升版到 Vue3 的過程中，我有看到這樣的寫法：{{ ref 變數 | $filters.comma.format }}，查了資料之後，知道這是 Vue2 filter 的寫法，但是這樣的寫法 {{ ref 變數 | $filters.comma.format }} 在 Vue3 並不起作用喔，Vue3 的要做相同的事情要做另外的處理。
maru
JS 小數點後位數處理-不自動進位
PM 發了一個 isssue，希望一個 input 輸入框中能夠限制到小數點 4 位，我很自然地使用了 toFixed(4)，結果發現輸入最後一位之後，如果再輸入的數字大於等於 5，小數點後第 4 位會自動加一，也就是小數點第 5 位數四捨五入後加一到小數點第二位。
把 Chart.js 的創建方法寫成 Composable
最近有點迷上 VUE3 的 composble 寫法，把可以重複利用的程式邏輯抽來變成composbal，要用的時候再匯入使用。今天我試著把 Chart.js 的創建方法抽出來放在 composables 中，沒想到竟然可行，以下整理一下我的作法。
雪山隧道文物館半日遊
國道五號，蔣渭水高速公路連接北二高南港系統到宜蘭蘇澳，全長55公里，耗時15年才完工，給了宜蘭人從台北安全回家的路，也讓台北人可以便利地來到宜蘭觀光，更讓兩地的資源可以用便捷的方式流通。但是這條舒適便利的高速公路要貫穿雪山山脈，沿路有著南港、石碇、烏塗、彭山、雪山等五座大大小小的隧道，其中以12.9公里長的雪山隧道工程最為艱辛。
隔山打牛的傳透 Attributes
VUE 官網把 Fallthrough Attributes 翻為 「透传 Attributes」，聽起來有點莫測高深，說穿了其實滿好懂的。簡單來講，如果在父層置入子元件，同時在父層的子元件上加上 class 樣式，則這個 class 樣式會傳入子元件與子元件內 DOM 的原本 class 樣式結合。
table-responsive 卷軸的坑
今天下午在做切版，照著 Bootstrap 官網的教學做 table，這是一個欄位比較多的表格，PM希望可以有卷軸，所以我幫在 table外面的 div的 class 加上了 .table-responsive，結果卷軸在很奇怪的斷點才出現，表格中的文字也被推擠折行。花了一下午在研究這個問題，晚上回家又不死心，總算解了出來。
input 欄位輸入數字時自動插入千分位逗點
最近在改一個舊專案的 input 欄位的千分位問題，它一般可以正常運作，也就是輸入到超過千位時，每三位數自動加上千分位點。但是有時候壞掉，就會變成出現千分位點之後，輸入的數字會重複，我檢查之後發現是一次輸入會觸發兩次 input 事件。所以我就去研究了 input 欄位判斷千分位點的作法。
橡皮擦計畫 Undoing Project
今天看到諾貝爾經濟學獎得主丹尼爾·康納曼在2024/3/27日過世了，心中不禁有點感傷。一直以來麥可·路易士所寫的「橡皮擦計畫」一直是我的愛書，這本書的紀錄丹尼爾·康納曼和阿莫斯·特沃斯基兩人的情誼，也討論了人類的決策如何被偏見影響。
Vue3-在 input 輸入框按 enter 觸發form刷新解法
之前幫一個舊專案升版到 Vue3，整個就專案都是用 Bootstrap Vue 寫的，每個 input 都被包在 Bootstrap Vue 封裝好的元件裏面，為了把這些封裝好的 input 拆出來，我花了很多功夫。其中遇到的一個難題是 input 輸入框按 enter 會觸發表單重整，全部輸入框都被清空了，還會觸發 click 事件，執行不該執行的函式，而這不是我想要的結果。
axios create() + Vue-loading-overlay 實戰應用
之前寫了 axios 的基本用法與搭配 axios create() 的使用方法，在這裡我想利用 pinia 共用 loading 的狀態，利用 .interceptors.request.use() 與 .interceptors.response.use()，開關 vue-loading-overlay 的效果。