小程序如何使用WXS

  1. WXS(WeiXin Script)是小程序的一套腳本語言, 結合 WXML, 能夠構建出頁面的結構, 那麼如何使用呢?vue

  2. 封裝common.wxs小程序

<!-- common.wxs -->
var vailFormat = function (value) {
    return value / 1000 + '千'
}

module.exports = {
  vailFormat: vailFormat  
}
複製代碼
  1. example.wxml頁面使用common.wxs
/* wxs是能夠直接在wxml頁面使用的 至關於vue.js的過濾器 wxml頁面使用必須用wxs標籤導入 且須要定義module名 不然沒法使用 若是不使用wxs 就須要對數組進行循環 操做dom  容易出錯 使用wxs很簡單 方便且能夠公用*/
<wxs src="common.wxs" module="common">
<view wx:for="{{list}}" wx:key="{{index}}">{{common.vailFormat(item)}}</view>
複製代碼
  1. example.js
data: { 
  list: [1000, 2000, 3000, 4000]
}
複製代碼
相關文章
相關標籤/搜索