Shulou(Shulou.com)06/01 Report--

In this article, the editor introduces in detail "how to use WeChat Mini Programs to achieve calculator function". The content is detailed, the steps are clear, and the details are handled properly. I hope this article "how to use WeChat Mini Programs to achieve calculator function" can help you solve your doubts. Let's follow the editor's ideas to learn new knowledge.

Page section

{{screenNum}} AC ← # / 7 8 9 * 4 56-1 2 3 + 0. =

Style part

.box {width:100%; height: 700px; background: # 000;} .txt {color:#fff; width:100%; height:120px; font-size: 50px; text-align: right;} .boxtn {width: 90px; height:90px; display:block; float:left; border-radius: 50%; line-height: 90px; text-align: center; margin-left: 3px; margin-top: 5px; color:#fff; background: # 333333 Font-weight: bold; font-size: 25px;} .btn {background: # f09a37;} .btn1 {background: # a5a5a5; color:#000;} .btn2 {width: 180px; border-radius: 40px;}

Js part

/ / index.js// gets the application instance const app = getApp () Page (initial data of {/ * page * / data: {screenNum: 0 / the number displayed on the screen currentNum: ", / / the number currently entered is storage: 0 / stored number operator:", / / operator off: false,} Compute: function (e) {var btn_num = e.target.dataset.val Var obj = this; if (! isNaN (btn_num)) {if (obj.data.off = = true) {obj.data.currentNum = "" obj.data.off = false;} obj.data.currentNum + = btn_num obj.data.currentNum = Number (obj.data.currentNum); obj.data.currentNum = obj.data.currentNum.toString () } else {switch (btn_num) {case "+": case "-": case "*": case "/": case "=": / / Save the number on the current screen and the operator this time to the variable if (obj.data.storage = = 0) {obj.data.storage = obj.data.currentNum Obj.data.operator = btn_num } else {if (obj.data.off! = true) {if (obj.data.operator = = "+") {obj.data.currentNum = Number (obj.data.storage) + Number (obj.data.currentNum)} else if (obj.data.operator = = "-") {obj.data.currentNum = Number (obj. Data.storage)-Number (obj.data.currentNum)} else if (obj.data.operator = "*") {obj.data.currentNum = Number (obj.data.storage) * Number (obj.data.currentNum)} else if (obj.data.operator = = "/") {obj.data.currentNum = Number (obj.data.storage) / Number (obj. Data.currentNum)}} obj.data.storage = obj.data.currentNum Obj.data.operator = btn_num;} obj.data.off = true; break; case "clear": obj.data.storage = 0; obj.data.currentNum = "0"; obj.data.operator = ""; break Case "back": obj.data.currentNum = obj.data.currentNum.slice (0,-1); if (obj.data.currentNum = = ") {obj.data.currentNum =" 0 ";} break; case". ": if (obj.data.currentNum.indexOf (". ") =-1) {/ / determine whether it contains". " Obj.data.currentNum + = btn_num} break;}} obj.setData ({screenNum: obj.data.currentNum}),})

The effect picture is as follows

Download address of Wechat developer tools

After reading this, the article "how to use WeChat Mini Programs to achieve calculator function" has been introduced. If you want to master the knowledge points of this article, you still need to practice and use it yourself to understand it. If you want to know more about related articles, welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.