微信小程序 实现计算属性

1、微信提供了一个wxs，是小程序的一套脚本语言，可以利用他实现计算属性，下面用他模拟一个计算总数的实现：

index.wxml:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

<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

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29

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