060143A

index.js

@@ -0,0 +1,61 @@
+// index.js
+// 获取应用实例
+const app = getApp()
+
+Page({
+  data: {
+    num:'0',
+    op:''
+  },
+result: null,
+isClear: false,
+numBtn: function(e) {
+　var num = e.target.dataset.val
+　if (this.data.num === '0' || this.isClear) {
+　 this.setData({ num: num })
+　 this.isClear = false
+　} else {
+　 this.setData({ num: this.data.num + num })
+ }
+},
+opBtn: function(e) {
+　var op = this.data.op
+　var num = Number(this.data.num)
+　 this.setData({ op: e.target.dataset.val })
+　if (this.isClear) {
+　  return
+　}
+　this.isClear = true
+　if (this.result === null) {
+　  this.result = num
+　  return
+　}
+　if (op === '+'){
+　  this.result = this.result + num
+　} else if (op === '-') {
+　  this.result = this.result - num
+　} else if (op === '*') {
+  　this.result = this.result * num
+  } else if (op === '/') {
+  　this.result = this.result / num
+  } else if (op === '%') {
+  　this.result = this.result % num
+  }
+  this.setData({ num: this.result + '' })
+},
+dotBtn: function(){
+  if(this.isClear){
+    this.isClear=false
+    return
+  }
+  this.setData({num:this.data.num+'.'})
+},
+delBtn:function(){
+  var num = this.data.num.substr(0,this.data.num.length-1)
+  this.setData({num: num==='' ?'0' :num})
+},
+resetBtn:function(){
+  this.result = null
+  this.isClear = false
+  this.setData({ num:'0',op:''})
+}})

index.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {},
+  "navigationBarBackgroundColor":"#fff",
+  "navigationBarTitleText":"计算器",
+  "navigationBarTextStyle":"black"
+}

index.wxml

@@ -0,0 +1,38 @@
+<!--index.wxml-->
+<view class="result"></view>
+<view class="btns"></view>
+<view class="btns">
+  <view>
+　  <view hover-class="bg" bindtap="resetBtn">C</view>
+    <view hover-class="bg" bindtap="delBtn">DEL</view>
+　  <view hover-class="bg" bindtap="opBtn" data-val="%">%</view>
+　  <view hover-class="bg" bindtap="opBtn" data-val="/">÷</view>
+  </view>
+  <view>
+    <view hover-class="bg" bindtap="numBtn" data-val="7">7</view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="8">8</view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="9">9</view>
+　  <view hover-class="bg" bindtap="opBtn" data-val="*">×</view>
+  </view>
+  <view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="4">4</view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="5">5</view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="6">6</view>
+　  <view hover-class="bg" bindtap="opBtn" data-val="-">-</view>
+  </view>
+  <view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="1">1</view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="2">2</view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="3">3</view>
+　  <view hover-class="bg" bindtap="opBtn" data-val="+">+</view>
+  </view>
+  <view>
+　  <view hover-class="bg" bindtap="numBtn" data-val="0">0</view>
+  　<view hover-class="bg" bindtap="dotBtn">.</view>
+　  <view hover-class="bg" bindtap="opBtn" data-val="=">=</view>
+  </view>
+</view>
+<view class="result">
+  <view class="result-num">{{num}}</view>
+  <view class="result-op">{{op}}</view>
+</view>

index.wxss

@@ -0,0 +1,61 @@
+/**index.wxss**/
+page {
+  display: flex;
+  flex-direction: column;
+  height: 100%
+   }
+   .result{
+     flex:1;
+     background:#ffffff;
+   }
+    .btns{
+     flex:1;
+   }
+    .bg {
+    background: #eee;
+   }
+    .btns {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    font-size: 17pt;
+    border-top: 1rpx solid #ccc;
+    border-left: 1rpx solid #ccc;
+    }
+    .btns > view {
+    flex: 1;
+    display: flex;
+    }
+    .btns > view > view {
+    flex-basis: 187.5rpx;
+    border-right: 0rpx solid #ccc;
+    border-bottom: 0rpx solid #ccc;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    }
+    .btns > view:last-child > view:first-child {
+    flex-basis: 375rpx;
+    }
+    .btns > view:first-child > view:first-child {
+    color: #f00;
+    }
+    .btns>view>view:last-child{
+    color:#fc8e00
+    }
+    .result{
+    flex: 2;
+    margin: 25px;
+    position: absolute;
+    }
+    .result-num{
+    font-size: 27pt;
+    bottom: 5vh;
+    right: 3vw;
+    }
+    .result-op{
+    font-size: 15pt;
+    bottom: 1vh;
+    right: 3vw;
+    }