網站只要有處理到錢和點數等,一定都會有數值顯示的問題想要統一,特別是後台數據呈現的時候,這時候選擇一個方便的工具統整顯示格式就非常重要了。
npm install numeral
或者Script引入資源也可以
<script src="numeral.min.js"></script>
針對數值最常見應該是千分位和小數點後兩位,直接使用這個套件,將你要的格式填上去就可以轉換成所需的樣子。
可以注意的小地方是,當格式轉換後回傳的型態是string
const number = numeral(1234)
number.format('0,0');
// 千分位:1,234
number.format('$0,0');
// 千分位+錢字符號:$1,234
number.format('0,0.00');
// 千分位+固定小數點後兩位:1,234.00
number.format('0,0.[00]');
// 千分位+小數點後兩位:1,234
// 注意:當是小數是0時不會顯示
Numeral.js 有提供其他格式化得選擇,像是百分比等等的,依照網站需求去配置即可。
(這邊不貼套件有提供的格式有哪些,可以直接點進去網站看!)
這邊推薦處理數值的格式方式,其實有很多種的處理方式,但都會建議把方法包裝起來,讓每個地方都統一使用,未來若需要異動格式時直接由包裝好的方法去異動就可以了!