vue.js實(shí)現(xiàn)價(jià)格格式化的方法

更新時(shí)間：2017年05月23日 16:37:01 作者：馬優(yōu)晨

這里分享一個(gè)常用的價(jià)格格式化的一個(gè)方法，在電商的價(jià)格處理中非常的實(shí)用，具體實(shí)現(xiàn)代碼大家參考下本文

這里分享一個(gè)常用的價(jià)格格式化的一個(gè)方法，在電商的價(jià)格處理中非常的實(shí)用，我們可以看一個(gè)效果

這里寫(xiě)圖片描述

這里在價(jià)格數(shù)據(jù)的地方使用了一個(gè)過(guò)濾器，通過(guò)這個(gè)過(guò)濾器對(duì)價(jià)格做了保留小數(shù)位的處理。

HTML

<div class="price">
 <span v-html="goods.sale_price|format"></span>
 <span class="price-before">￥{{＂這里是價(jià)格數(shù)據(jù)＂}}</span>
</div>

filters:{  //數(shù)據(jù)過(guò)濾器
 format:function(value){
  var html,_val;
  value =Number(value).toFixed(2);
  if(value==0){
   value=0;
   return html = "￥<span>0</span>";
  }else if(value.split('.')[1].substring(1)==0){
   value = Number(value).toFixed(1);
  }
  _val = value.split('.');
  return html = '￥<span>'+_val[0]+'</span><em>.'+_val[1]+'</em>';
 }
}

以上所述是小編給大家介紹的vue.js實(shí)現(xiàn)價(jià)格格式化的方法，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

.html頁(yè)面引入vue并使用公共組件方式
這篇文章主要介紹了.html頁(yè)面引入vue并使用公共組件方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-01-01
聊聊Vue中provide/inject的應(yīng)用詳解
這篇文章主要介紹了聊聊Vue中provide/inject的應(yīng)用詳解，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-11-11
Vue+ssh框架實(shí)現(xiàn)在線聊天
這篇文章主要為大家詳細(xì)介紹了Vue+ssh框架實(shí)現(xiàn)在線聊天，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-06-06
Vue百度地圖實(shí)現(xiàn)定位和marker拖拽監(jiān)聽(tīng)功能
這篇文章主要介紹了Vue百度地圖實(shí)現(xiàn)定位和marker拖拽監(jiān)聽(tīng)功能,實(shí)現(xiàn)思路非常簡(jiǎn)單，本文結(jié)合實(shí)例代碼效果圖給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2022-11-11
vue基礎(chǔ)入門(mén)之vuex安裝與使用
vuex是一個(gè)專為vue.js應(yīng)用程序開(kāi)發(fā)的狀態(tài)管理模式,它采用集中式存儲(chǔ)管理應(yīng)用的所有的狀態(tài),并以相應(yīng)的規(guī)則保證狀態(tài)以一種可預(yù)測(cè)的方式發(fā)生變化,這篇文章主要給大家介紹了關(guān)于vue入門(mén)之vuex安裝與使用的相關(guān)資料,需要的朋友可以參考下
2021-08-08
Vue Mixins混入介紹與使用
如果我們?cè)诿總€(gè)組件中去重復(fù)定義這些屬性和方法會(huì)使得項(xiàng)目出現(xiàn)代碼冗余并提高了維護(hù)難度，針對(duì)這種情況官方提供了Mixins特性，這時(shí)使用Vue mixins混入有很大好處，下面就介紹下Vue mixins混入使用方法，需要的朋友參考下吧
2023-02-02
elementui?el-select?change事件傳參問(wèn)題
這篇文章主要介紹了elementui?el-select?change事件傳參問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-01-01
Vue模擬響應(yīng)式原理底層代碼實(shí)現(xiàn)的示例
最近去面試的人都會(huì)有這個(gè)體會(huì),去年面試官只問(wèn)我怎么用vue,今年開(kāi)始問(wèn)我vue響應(yīng)式原理，本文就詳細(xì)的介紹一下
2021-08-08
詳解vue中引入stylus及報(bào)錯(cuò)解決方法
這篇文章主要介紹了詳解vue中引入stylus及報(bào)錯(cuò)解決方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
Vue+Bootstrap收藏（點(diǎn)贊）功能邏輯與具體實(shí)現(xiàn)
這篇文章主要為大家詳細(xì)介紹了Vue+Bootstrap收藏（點(diǎn)贊）功能邏輯與具體實(shí)現(xiàn)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-10-10