环境: OS:Windows 10 专业版 1903 64位 小程序开发工具版本:stable 1.02.1910120 问题描述: 学习小程序开发,加法计算器,在模拟器中input组件无法捕获bindinput事件,在iOS端微信就可以。 以下代码,在模拟器端无法捕获bindinput,无论输入什么计算结果都是零,在iOS端就可以得出正确的计算结果。 代码: 1、cal.wxml
<!--pages/cal/cal.wxml--> < view class = "container" > < input placeholder = "被加数" bindinput = "bindInput1" /> < input placeholder = "加数" bindinput = "bindInput2" /> < button type = "primary" bindtap = "bindAdd" >计算</ button > < input placeholder = "结果" value = "{{result}}" disabled/> </ view > |
2、cal.wxss
/* pages/cal/cal.wxss */ .container { justify- content : flex-start; padding : 30 rpx 0 ; } .container input{ background-color : #eee ; border-radius: 3px ; text-align : left ; width : 720 rpx; height : 100 rpx; line-height : 100 rpx; margin : 20 rpx } .container buton{ width : 80% } |
3、cal.js
// pages/cal/cal.js Page({ /** * 页面的初始数据 */ data: { num1: "" , //被加数 num2: "" , //加数 result: "" //结果 }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { }, bindAdd: function (e) { var r = this .data.num1 * 1 + this .data.num2 * 1; console.log(r); this .setData({ result: r }); }, bindInput1: function (e) { var n = e.detail.value; console.log(n); if (!isNaN(n)) { this .setData({ num1: n }); }; }, bindInput2: function (e) { var n = e.detail.value; console.log(n); if (!isNaN(n)) { this .setData({ num2: n }); }; } }) |
模拟器计算结果截图:
ios端微信运行小程序计算结果截图: