在Vue中我們可以使用filter函數(shù)來(lái)實(shí)現(xiàn)管道過(guò)濾器，那么在小程序中是如何實(shí)現(xiàn)的呢？

我使用過(guò)濾器的原因是，不想寫在本page的js里面，這樣在其他page想要用這個(gè)方法的時(shí)候，就要再次定義一次，成本太高。所以想寫在一個(gè)公共的文件中，當(dāng)哪個(gè)頁(yè)面想要使用這個(gè)方法時(shí)，可以直接引入使用，像Vue中一樣。

查看微信開放文檔，發(fā)現(xiàn)了一個(gè)wxs文件，接下來(lái)的實(shí)例，是使用wxs文件來(lái)實(shí)現(xiàn)對(duì)距離進(jìn)行格式化的方法：

第一步：創(chuàng)建wxs方法

在utils文件夾下，新建filter.wxs文件

utils/filter.wxs:

var filterDistance=function(dis){
  if(dis<= 999){
    return dis+'m'
  }else if(dis>999){
    return (dis/1000).toFixed(2)+'km'
  }
}
module.exports = {
  filterDistance:filterDistance
}

第二步：使用

在使用該方法的頁(yè)面的wxml文件中使用：

xx.wxml文件中：

<wxs src="./../../../utils/filter.wxs" module="filterDistance"/>
<text class="groups-right-position-item">
	{{filterDistance.filterDistance(staff.schools[0].distance)}}
</text>

第三步：效果

記錄留檔，希望可以幫助到你。
努力過(guò)的每一分鐘都是有意義的。