uni-app 是一个使用 Vue.js 开发所有前端应用的框架,filters一样通用
1.新建文件存放所有的公用filters(@/filters/index.js)
此处以千字符加逗号过滤器toThousandFilter为例
//filters/index.js
/**
* 10000 => "10,000"
* @param {number} num
*/
export function toThousandFilter(num) {
return (+num || 0).toString().replace(/^-?\d+/g, m => m.replace(/(?=(?!\b)(\d{3})+$)/g, ','))
}
2.main.js全局引入
import Vue from 'vue'
import App from './App'
import * as filters from './filters' // global filters
// register global utility filters
Object.keys(filters).forEach(key => {
Vue.filter(key, filters[key])
})
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
3.页面使用
<template>
<view class="container">
商品总价 (元) : {{totalPrice | toThousandFilter}}
</view>
</template>
<script>
export default {
data() {
return {
totalPrice :9999
}
}
}
</script>
效果图如下
image.png
