在微信小程序中使用的wxs文件相当于执行一段js,对数据进行处理,转到uniapp中可以使用过滤器来解决这个问题。
功能:m与km转化,<1000显示 m; >1000显示 km
在微信小程序中使用wxs实现方法:
1、在utils文件下创建一个transfer.wxs文件
// m=km转化:<1000显示m;>1000显示km;
var setMorKm = function(m){
var n=''
if(m){
if (m >= 1000) {
n = (m / 1000).toFixed(2) + 'km'
} else if (m < 1000) {
n = m + 'm'
} else {
n = '0m'
}
}else{
n = '0m'
}
return n
}
module.exports = {
setMorKm: setMorKm
}
2、在mypage.wxml中使用
<!-- 1 引入 -->
<wxs src="../../utils/interupt.wxs" module="interupt" />
<!-- 2 引用 -->
<text>{{interupt.setMorKm(distance)}} </text>
在uniapp中使用filter来实现这个功能
1、在common文件夹下新建一个transfer.js 文件
const transfer= {
setMorKm:function(m){
var n=''
if(m){
if (m >= 1000) {
n = (m / 1000).toFixed(2) + 'km'
} else if (m < 1000) {
n = m + 'm'
} else {
n = '0m'
}
}else{
n = '0m'
}
return n
},
}
export default transfer;
2、在main.js中注册这个transfer
import transfer from './common/transfer';
for (let key in transfer) {
Vue.filter(key, transfer[key]);
}
3、在mypage.vue中使用
<text>{{distance|setMorKm}} </text>