技術標籤：前端基礎筆記過濾器vuejavascript

vue的過濾器

我寫這篇文章是我在開發過程中遇到了這個問題，就是有一個小小的bug，需要將後臺傳過來的值2364828轉換為以萬結尾的單位，我就試著網上看看，試了幾種網友分享的方法都不行，後來看到了一個貼子，試了一下果然成功了。這裡我來具體的將問題以及解決辦法說一下。

問題

可以看到我在網頁上顯示的是一串長長的數字

解決方法

<div class="count">
        <div>
          <img src="~assets/img/content/erji.svg"
 
 alt />
       <span> {{item.playCount| playvolume}} </span>
        </div>

JavaScript程式碼

<script>
export default {
	data() {
		return {				};	
	},
	
	onLoad() {},

	//這裡的單位可以根據你自己的需求做更改可以改成千、萬等等
	//後面的.toFixed為保留兩位小數
	
	filters:{
		//取截單元,單位
		playvolume:function(arg){
			if(arg.
 
toString().length>=13){
				// return arg/1000000000000+"萬億"
				const volume= arg/1000000000000
				const realVal = parseFloat(volume).toFixed(2);
				return realVal+"萬億"
				
			}else if(arg.toString().length>=9){
				const volume= arg/100000000
				const realVal = parseFloat(volume).toFixed(2);
				return realVal+
 
"億"
			}else if(arg.toString().length>=4){
				const volume= arg/10000
				const realVal = parseFloat(volume).toFixed(2);
				return realVal+"萬"
			}
			
		}
	}
};
</script>

<style>
</style>

效果圖

我這裡將.toFixed(0)改為了0，不保留小數點。

轉載連結：https://blog.csdn.net/qq_34596127/article/details/108263964

.toFixed具體使用方法：https://www.w3school.com.cn/js/jsref_tofixed.asp