新版本的小程式的wxs功能可以讓wsmxl可以呼叫和編寫js

在根目錄的util資料夾下,新建filter.wxs檔案 不能使用const const是ES6的語法  wxs無法運用

基本上wxs和JS無關係,只是語法形式很相似! 編寫幾個方法 就把方法名寫到module.exports中!

//將反斜槓轉換成文字
var format = function(text){
//如果傳進來的text不存在
  if(!text){
    return
  }
//正則表示式匹配
  var reg =  getRegExp('\\\\n','g')
  return text.replace(reg,'\n ')
}
//限制獲取的條數 
var limit = function (array,length){
  return array.slice(0, length)
}
module.exports = {
  format:format,
  limit:limit 
}
 

編寫完之後,如何引入wxml檔案中呢?  src是引入的檔案路徑,module是給引入的模組,也就是wxs檔案定義一個新的名字(隨便取)

<!-- 引入wxs模組 -->
<wxs src="../../util/filter.wxs" module="util"/>

然後在wxml檔案中需要他的地方進行呼叫,util值wxs檔案,limit檔案中的方法

<!-- 限制獲取的條數 -->
<block wx:for="{{util.limit(comments,5)}}" wx:key="">

以上是wxs寫在頁面的外部檔案的方法,現在介紹如果在頁面檔案中編寫wxs:

module等於tool 也就是這個模組名為tool,

//wxml程式碼底部下編寫
<wxs module="tool">
  var highlight = function(index){
    if(index==0){
      return 'ex-tag1';
    }
    if(index==1){
      return 'ex-tag2';
    }
    return ''
  }
  module.exports={
    highlight:highlight
  }
</wxs> 

解析來是如何呼叫:highlight為模組下的方法名

<v-tag bind:tapping="onPost" tag-class="{{tool.highlight(index)}}"
            text="{{item.content}}" >