本文例項為大家分享了全域性實現數字千位分隔符格式的具體程式碼，供大家參考，具體內容如下

這個是啥意思呢 ？ 就是我們在頁面上需要渲染資料的時候，比如 88888，我們需要按照千分位顯示成方便閱讀的格式88,888。

這個時候我的做法是vue寫一個過濾器，將所有的資料都用這個過濾器過濾一下。

因為涉及的資料相對比較多，我就將這個過濾器掛載到了全域性，這樣就不用再每個頁面引用了。

轉換程式碼實現

首先建立一個檔案 numberToCurrency. ，實現數字千位分隔符轉換功能。

exporthttp://www.cppcns.com function numberToCurrencyNo(value) {
  if (!value) return 0
  // 獲取整數部分
  const intPart = Math.trunc(value)
  // 整數部分處理，增加,const intPartFormat = intPart.toString().replace(/(\d)http://www.cppcns.com
 
(?=(?:\d{3})+$)/g,'$1,')
  // 預定義小數部分
  let floatPart = ''
  // 將數值擷取為小數部分和整數部分
  const valueArray = value.toString().split('.')
  if (valueArray.length === 2) { // 有小數部分
    floatPart = valueArray[1].toString() // 取得小數部分
    return intPartFormat + '.' + floatPart
  }
  return intPartFormat + nYDINAE
 
floatPart
}

好了，這樣就實現了，當然如果有其他的需求，具體的轉換程式碼得根據實際來修改。

接下來就是引用。

引用掛載全域性

在 mainYDINAEn.js 檔案中引入剛才的過濾器檔案，並且掛載到全域性。

import { numberToCurrwww.cppcns.comencyNo } from '@/utils/numberToCurrency'
// 配置全域性過濾器，實現數字千分位格式
Vue.filter('numberToCurrency',numberToCurrencyNo)

這樣子就可以了，然後在具體需要轉換的地方使用一下就OK了。

使用

使用的話就是普通過濾器的使用方法。

<p class="num color1">{{riskAll| numberToCurrency}}</p>

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。