美文网首页
微信小程序学习:简易计算器

微信小程序学习:简易计算器

作者: Monica114 | 来源:发表于2019-02-20 17:15 被阅读0次

昨天刚刚接触的微信小程序,写了个计算器demo,因为自身有一点前端的基础,所以看微信小程序的api时没有这么云里雾里,几乎跟前端没差太多,所以上手挺快,先上效果图

仿制iphone的计算器实现了+-*/百分比负号等运算,不过其中还有很多的小bug,比如点击数字外的黑色背景时如果数字是最开始的0,那么0就会隐藏,第二屏幕适配问题,iphoneX感观不好,

下面是部分代码:

这是wxml文件,跟html差不多都是标签。比如<view></view>就是html里的<div></div>,<text></text>相当于<p>标签

wxss跟css一样

js文件,里面可以像vue一样实时更新数据。很方便,遇到的难点是微信小程序没有eavl()函数,不能直接计算字符串,经过网上查阅资料可以通过第三库的js来帮忙解决问题,引入rpn.js,在底部先暴露,才能引用外部js。

引入外部js文件要先暴露出来,才能在你需要的文件里通过require('路径')引入使用,调用calCommonExp(str)方法就可以直接运算字符串,小细节还有很多没完成,还有挺多bug,算是自己的一个小收获。

完整源码可以去我的github查看:https://github.com/aa906849411/Mini-Program

相关文章

网友评论

      本文标题:微信小程序学习:简易计算器

      本文链接:https://www.haomeiwen.com/subject/onghyqtx.html