小程序之加减乘除

作者 : 开心源码 本文共3596个字,预计阅读时间需要9分钟 发布时间: 2022-05-11 共60人阅读

使用微信小程序写了一个加减乘除的运算,看效果能去微信搜

“吃盖浇饭”

image.png

下面上代码

js文件

Page({  /**   * 页面的初始数据   */  data: {    id1:'退格',    id2: 'back',    id3:'0',    id4:'+',    id5:'9',    id6: '8',    id7: '7',    id8: '-',    id9: '6',    id10: '5',    id11: '4',    id12: '/',    id13: '3',    id14: '2',    id15: '1',    id16: '=',    screenData:"0",    lastIspast:"",    str:[]  },  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {      },  /**   * 生命周期函数--监听页面首次渲染完成   */  onReady: function () {      },  /**   * 生命周期函数--监听页面显示   */  onShow: function () {      },  /**   * 生命周期函数--监听页面隐藏   */  onHide: function () {      },  /**   * 生命周期函数--监听页面卸载   */  onUnload: function () {      },  /**   * 页面相关事件解决函数--监听使用户下拉动作   */  onPullDownRefresh: function () {      },  /**   * 页面上拉触底事件的解决函数   */  onReachBottom: function () {      },  /**   * 使用户点击右上角分享   */  onShareAppMessage: function () {      },  history: function(){    // wx.navigateTo({    //   // url: 'https://www.baidu.com/'    // })  },  clickButton: function(event) {    console.log(event.target.id);    var sd = this.data.screenData;    var id = event.target.id    if(id==this.data.id1){      var data = this.data.screenData;      if(data == 0 ){        return      }      data = data.substring(0,data.length-1);      if(data == "" || data == "-"){        data = 0;      }      this.setData({screenData:data});    }else if(id == this.data.id2){      this.setData({        screenData:"0"      })    } else if (id == this.data.id3){      this.setData({        screenData: "0"      })    } else if (id == this.data.id16){          var data = this.data.screenData;      if(data==0){        return;      }      var lastWrod = data.substring(data.length-1,data.lentgh);      if(isNaN(lastWrod)){        return      }      var num = "";      var lastOperator;      var arr = this.data.screenData.split("");      var optarr = [];      for(var i in arr){        if(isNaN(arr[i])==false){          num+=arr[i];        }else{          lastOperator = arr[i];          optarr.push(num);          optarr.push(arr[i]);          num=""        }      }      optarr.push(Number(num));      var result = Number(optarr[0])*1.0;      console.log(result)      for(var i=1;i<optarr.length;i++){        if (isNaN(optarr[i])){          if(optarr[1]==this.data.id4){            result+=Number(optarr[i+1])          } else if (optarr[1] == this.data.id8){            result -= Number(optarr[i + 1])          } else if (optarr[1] == this.data.id12){            result /= Number(optarr[i + 1])          }        }      }      this.data.str.push(result);      wx.setStorageSync('key', this.data.str)      console.log(wx.getStorageSync('key'))      this.setData({        screenData: result+""      })    }else{      var data;      if (sd == 0) {        data = id;      } else {        data = sd + id;      }      this.setData({        screenData: data      })    }     }})

wxml文件

<view class="content">  <view class="screen">    {{screenData}}  </view>  <view class='btnGroup'>      <view class='item orange' bindtap="clickButton" id="{{id1}}">退格</view>       <view class='item orange' bindtap="clickButton" id="{{id2}}">清屏</view>        <view class='item orange' bindtap="clickButton" id="{{id3}}">0</view>         <view class='item orange' bindtap="clickButton" id="{{id4}}">+</view>  </view>   <view class='btnGroup'>      <view class='item orange' bindtap="clickButton" id="{{id5}}">9</view>       <view class='item orange' bindtap="clickButton" id="{{id6}}">8</view>        <view class='item orange' bindtap="clickButton" id="{{id7}}">7</view>         <view class='item orange' bindtap="clickButton" id="{{id8}}">-</view>  </view>   <view class='btnGroup'>      <view class='item orange' bindtap="clickButton" id="{{id9}}">6</view>       <view class='item orange' bindtap="clickButton" id="{{id10}}">5</view>        <view class='item orange' bindtap="clickButton" id="{{id11}}">4</view>         <view class='item orange' bindtap="clickButton" id="{{id12}}">/</view>  </view>   <view class='btnGroup'>      <view class='item orange' bindtap="clickButton" id="{{id13}}">3</view>       <view class='item orange' bindtap="clickButton" id="{{id14}}">2</view>        <view class='item orange' bindtap="clickButton" id="{{id15}}">1</view>         <view class='item orange' bindtap="clickButton" id="{{id16}}">=</view>  </view>   <view>      <view bindtap="history">          想整拼图,可惜失败了      </view>   </view> </view>

wxss文件

.content{  height: 100%;  display: flex;  flex-direction: column;  align-items: center;  box-sizing: border-box;}.screen{  background-color: #fff;  border-radius:3px;  text-align: center;  width: 720rpx;  height: 100rpx;}.btnGroup{  display:flex;  flex-direction: row}.item{  width:160rpx;  min-height: 150rpx;  margin:10px;  text-align: center;  line-height: 150rpx;}

完工。

说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » 小程序之加减乘除

发表回复