調整 Intl.NumberFormat 顯示單位

前言

  Intl.NumberFormat 可以顯示單位，但有些單位會有需要顯示所縮寫或完整顯示的需求，這時就需要透過參數的調整來顯示，在此把學習的過程做個紀錄。

內容

  範例如下

let number = 100;
//
console.log( new Intl.NumberFormat('zh-TW', { 
  style: 'unit', 
  unit : 'liter',
  unitDisplay : 'short',
  }).format( number) );//100 升
//
console.log( new Intl.NumberFormat('zh-TW', { 
  style: 'unit', 
  unit : 'liter',
  unitDisplay : 'narrow',
  }).format( number) );//100升
//
console.log( new Intl.NumberFormat('zh-TW', { 
  style: 'unit', 
  unit : 'liter',
  unitDisplay : 'long',
  }).format( number) );//100 公升

要調整顯示單位可以透過 unitDisplay 來調整，可以接受的參數有 short 、 narrow 與 long ，範例以公升來示範， short 顯示(空白)與升，narrow 就只顯示升，long 才會顯示(空白)與公升，short 與 narrow 顯示縮寫，差異在於有沒有空白，long 則是完全顯示。

參考資料

[ developer.mozilla.org ] Intl.NumberFormat

相關文章與資料

使用 Intl.NumberFormat 顯示單位