微信小程序 實現計算屬性

1、微信提供了一個wxs，是小程序的一套腳本語言，可以利用他實現計算屬性，下面用他模擬一個計算總數的實現：

index.wxml:

<view style="display:flex;margin:20px">
    <input style="border:1px solid #000000" type="number" value="{{num1}}" bindinput="mobileInput1" />
    <text>+</text>
    <input style="border:1px solid #000000" type="number" value="{{num2}}" bindinput="mobileInput2" />
</view>


<!--調用並傳參-->
<view style="margin:20px">總數為：{{ m1.newSum(num1,num2) }} </view>


<wxs module="m1">
    var newSum = function(num1,num2) {

        num1 = Number(num1);
        num2 = Number(num2);

        return num1 + num2;
    }
    module.exports.newSum = newSum;
</wxs>

　　

　index.js

// pages/test/index.js
Page({

  /**
   * 頁面的初始數據
   */
  data: {
   
      num1: 200,
      num2:350
   
  },


  mobileInput1 : function (e) {

    const value = e.detail.value;
    this.setData({
      num1:value
    })
   
  },
  mobileInput2 : function (e) {
    const value = e.detail.value;
    this.setData({
      num2:value
    })
  }
})

2、可以實現兩個input在輸入的時候，總數可以實時計算新的數值，效果如下：（如果你想了解更多可以前往官方文檔：https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/）