使用vue写的计算器demo

calculator

一个vue实现的简单计算器

技术栈

  • [x] vue
  • [x] webpack
  • [x] AlloyFinger
  • [x] vue computed

实现的效果

  • [x] 左右滑动切换主题
  • [x] 整数位大于3位自动添加逗号
  • [x] 输入加减乘除符号直接计算结果
  • [x] 清除所有数据
  • [x] 退格
  • [ ] 按钮动画
  • [x] 在输出结果之后不能退格

bug

  • [x] 在手机段不是全屏固定的，可以拖动
calculator.gif

写后感

写这个纯属想弄一个好看点的，没想到写的时候花了好几天，没有头绪，还存在很多bug，颜色切换也是切换了整个css，还有很多需要优化整改的地方，慢慢改进中~~~

下面是预览和源码地址，欢迎star，fork。
在线预览
项目源码

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • Vue相关开源项目库汇总(史上最全)
    目录 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element★13489 ...
    余生社会阅读 20,126评论 7赞 233
  • 黄金思维圈
    黄金思维圈是一种思维模式。why：你为什么做这件事，how：为了这个why你需要用什么方法，采取什么措施。what...
    湖畔小镇阅读 286评论 0赞 0
  • 更多维度能力构建价值人生
    有一个现象非常常见，在学校读书的时候，总有一些学习很厉害的“学霸”他们在校园学习生活中可谓是叱咤风云，要风得风，要...
    空背包阅读 527评论 0赞 0
  • 对自己负责
    对自己负责，第一，不需要他人来为你操闲心；第二，你才能拥有真正的自己。 很多年前看电视剧《都是天使惹的祸》，主演是...
    光华同学阅读 604评论 0赞 48