微信小程序写的一个简单计算器

2022-06-24 12:49:14

微信小程序写的简单计算器
jisaunqi.js

// pages/jisuanqi/jisuanqi.jsPage({/**
   * 页面的初始数据
   */
  data:{
    result:"0",
    string:"",
    cal:"",
    num1:"",
    num2:""},
  btSubmit:function(e){
    console.log(e);var num1=this.data.num1;var cal=this.data.cal;var num2=this.data.num2;var char= e.target.id;var string;if((char>="0"&&char<="9"||char=='.')&&cal==""){
      num1=num1+char;this.setData({
        num1:num1,})}elseif((char>="0"&&char<="9"||char=='.')&&cal!=""){
      num2=num2+char;this.setData({
        num2:num2,})}else{
      cal=char;this.setData({
        cal:cal,})}this.setData({
     string:num1+cal+num2})},
  clean:function(e){this.setData({
      string:"",
      num1:"",
      num2:"",
      cal:""})},
  calculate:function(e){var num1=this.data.num1;var num2=this.data.num2;var cal=this.data.cal;var result;switch(cal){case'+':result=num1*1+num2*1;break;case'-':result=num1*1-num2*1;break;case'*':result=(num1*1)*(num2*1);break;case'/':result=(num1*1)/(num2*1);break;}
    num1=result;
    cal="";
    num2="";this.setData({
      result:result,
      num1:num1,
      cal:cal,
      num2:num2})},
  reverse:function(e){var cal=this.data.cal;var num1=this.data.num1;var num2=this.data.num2;if(cal==""){num1="-";}elseif(cal!=""){num2="-"}this.setData({
      num1:num1,
      num2:num2})},
  lololo:function(e){
    console.log(123)},
  confirm:function(e){
    console.log(555);
    console.log(e)},
  event:function(e){
    wx.navigateTo({
      url:'/pages/event/event',})},
  bindinput:function(e){
    console.log(1)},
  jisuanqi:function(e){var n1=e.detail.value.num1;var n2=e.detail.value.num2;var result=n1*1+n2*1;
    console.log(n1);
    console.log(n2);
    console.log(result);this.setData({
      result:result})},
  tiaozhuan:function(e){
    wx.navigateTo({
      url:'/pages/9x9form/9x9form',})},/**
   * 生命周期函数--监听页面加载
   */
  onLoad:function(options){},/**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady:function(){},/**
   * 生命周期函数--监听页面显示
   */
  onShow:function(){},/**
   * 生命周期函数--监听页面隐藏
   */
  onHide:function(){},/**
   * 生命周期函数--监听页面卸载
   */
  onUnload:function(){},/**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh:function(){},/**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom:function(){},/**
   * 用户点击右上角分享
   */
  onShareAppMessage:function(){}})

jisuanqi.json

{"usingComponents":{},"navigationBarTitleText":"计算器"}

jisuanqi.wxml

<viewclass="container"><viewclass="view1">{{string}}</view><viewclass="view2">{{result}}</view><viewclass="button-group"><buttonclass="button">历史</button><buttonclass="button"bindtap="clean">C</button><buttonclass="button"></button><buttonclass="button"id="/"bindtap="btSubmit">/</button></view><viewclass="button-group"><buttonclass="button"id="7"bindtap="btSubmit">7</button><buttonclass="button"id="8"bindtap="btSubmit">8</button><buttonclass="button"id="9"bindtap="btSubmit">9</button><buttonclass="button"id="*"bindtap="btSubmit">*</button></view><viewclass="button-group"><buttonclass="button"id="4"bindtap="btSubmit">4</button><buttonclass="button"id="5"bindtap="btSubmit">5</button><buttonclass="button"id="6"bindtap="btSubmit">6</button><buttonclass="button"id="-"bindtap="btSubmit">-</button></view><viewclass="button-group"><buttonclass="button"id="1"bindtap="btSubmit">1</button><buttonclass="button"id="2"bindtap="btSubmit">2</button><buttonclass="button"id="3"bindtap="btSubmit">3</button><buttonclass="button"id="+"bindtap="btSubmit">+</button></view><viewclass="button-group"><buttonclass="button"bindtap="reverse">-(符号减)</button><buttonclass="button"id="0"bindtap="btSubmit">0</button><buttonclass="button"id="."bindtap="btSubmit">.</button><buttonclass="button"bindtap="calculate">=</button></view></view><navigatorurl="/pages/event/event">跳转到event</navigator>//

jisuanqi.wxss

.button{width: 160rpx;height: 100rpx;margin-left: 10rpx;padding-left: 10rpx;margin-top: 10rpx;text-align: center;line-height: 100rpx;padding: 5px;border-radius: 5px;}.button-group{display: flex;flex-direction: row;align-content: flex-start;}.container{display: flex;flex-direction: column;justify-content: flex-end;/* align-content: flex-end; */}.view1{height: 100rpx;background-color: #e4e4e4;line-height: 100rpx;font-size: 20px;}.view2{height: 100rpx;margin-top: 5px;background-color: #e4e4e4;line-height: 100rpx;font-size: 20px;}
  • 作者:Little BigUs
  • 原文链接:https://blog.csdn.net/m0_45972156/article/details/115559212
    更新时间:2022-06-24 12:49:14