微信小程序 实现计算属性

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/）