微信小程序 实例应用(记账)详解


Posted in Javascript onSeptember 28, 2016

 微信小程序-记账小应用

github地址:  https://github.com/HowName/account-note

微信小程序 实例应用(记账)详解

var util = require("../../utils/util.js");
//获取应用实例
var app = getApp();
Page({
 data: {
  userInfo: {},
  buttonLoading: false,
  accountData:[],
  accountTotal:0
 },
 onLoad: function () {
  console.log('onLoad')
  var that = this;
 
  // 获取记录
  var tempAccountData = wx.getStorageSync("accountData") || [];
  this.caculateTotal(tempAccountData);
  this.setData({
    accountData: tempAccountData
  });
 
 },
 // 计算总额
 caculateTotal:function(data){
   var tempTotal = 0;
   for(var x in data){
     tempTotal += parseFloat(data[x].amount);
   }
   this.setData({
    accountTotal: tempTotal
   });
 },
 //表单提交
 formSubmit:function(e){
   this.setData({
    buttonLoading: true
   });
 
   var that = this;
   setTimeout(function(){
     var inDetail = e.detail.value.inputdetail;
     var inAmount = e.detail.value.inputamount;
     if(inDetail.toString().length <= 0 || inAmount.toString().length <= 0){
       console.log("can not empty");
       that.setData({
        buttonLoading: false
       });
       return false;
     }
 
     //新增记录
     var tempAccountData = wx.getStorageSync("accountData") || [];
     tempAccountData.unshift({detail:inDetail,amount:inAmount});
     wx.setStorageSync("accountData",tempAccountData);
     that.caculateTotal(tempAccountData);
     that.setData({
       accountData: tempAccountData,
       buttonLoading: false
     });
 
   },1000);
 },
 //删除行
 deleteRow: function(e){
   var that = this;
   var index = e.target.dataset.indexKey;
   var tempAccountData = wx.getStorageSync("accountData") || [];
   tempAccountData.splice(index,1);
   wx.setStorageSync("accountData",tempAccountData);
   that.caculateTotal(tempAccountData);
   that.setData({
    accountData: tempAccountData,
   });
 }
})

通过此文,希望大家对微信小程序了解,并应用,谢谢大家对本站的支持!

Javascript 相关文章推荐
js/jQuery简单实现选项卡功能
Jan 02 Javascript
jquery动态添加元素事件失效问题解决方法
May 23 Javascript
js实现兼容IE和FF的上下层的移动
May 04 Javascript
教你如何终止JQUERY的$.AJAX请求
Feb 23 Javascript
JS获取checkbox的个数简单实例
Aug 19 Javascript
javascript基于原型链的继承及call和apply函数用法分析
Dec 15 Javascript
javascript设计模式之策略模式学习笔记
Feb 15 Javascript
jquery.uploadView 实现图片预览上传功能
Aug 10 jQuery
node.js学习之断言assert的使用示例
Sep 28 Javascript
vue2.0实现音乐/视频播放进度条组件
Jun 06 Javascript
vue项目打包后请求地址错误/打包后跨域操作
Nov 04 Javascript
JS前端使用canvas实现扩展物体类和事件派发
Aug 05 Javascript
JavaScript 闭包详细介绍
Sep 28 #Javascript
Bootstrapvalidator校验、校验清除重置的实现代码(推荐)
Sep 28 #Javascript
bootstrap datepicker限定可选时间范围实现方法
Sep 28 #Javascript
BootstrapValidator不触发校验的实现代码
Sep 28 #Javascript
bootstrap datepicker 与bootstrapValidator同时使用时选择日期后无法正常触发校验的解决思路
Sep 28 #Javascript
使用bootstrapValidator插件进行动态添加表单元素并校验
Sep 28 #Javascript
BootStrap 动态添加验证项和取消验证项的实现方法
Sep 28 #Javascript
You might like
用来解析.htgroup文件的PHP类
2012/09/05 PHP
PHP计算加权平均数的方法
2015/07/16 PHP
PHP编写的图片验证码类文件分享
2016/06/06 PHP
详解php中空字符串和0之间的关系
2016/10/23 PHP
php基于自定义函数记录log日志方法
2017/07/21 PHP
基于PHP实现的多元线性回归模拟曲线算法
2018/01/30 PHP
javascript获取作用在元素上面的样式属性代码
2012/09/20 Javascript
JavaScript中创建类/对象的几种方法总结
2013/11/29 Javascript
关于Javascript作用域链的八点总结
2013/12/06 Javascript
jquery实现的3D旋转木马特效代码分享
2015/08/25 Javascript
利用CSS、JavaScript及Ajax实现图片预加载的三大方法
2017/01/22 Javascript
JS实现点击链接切换显示隐藏内容的方法
2017/10/19 Javascript
React Native使用百度Echarts显示图表的示例代码
2017/11/07 Javascript
浅谈Node.js 中间件模式
2018/06/12 Javascript
分享5个小技巧让你写出更好的 JavaScript 条件语句
2018/10/20 Javascript
JS阻止事件冒泡的方法详解
2019/08/26 Javascript
vue + axios get下载文件功能
2019/09/25 Javascript
微信小程序如何加载数据库真实数据的实现
2020/03/04 Javascript
Python实现通过解析域名获取ip地址的方法分析
2019/05/17 Python
python中metaclass原理与用法详解
2019/06/25 Python
Python字符串、列表、元组、字典、集合的补充实例详解
2019/12/20 Python
TensorFlow实现保存训练模型为pd文件并恢复
2020/02/06 Python
Python selenium键盘鼠标事件实现过程详解
2020/07/28 Python
Django启动时找不到mysqlclient问题解决方案
2020/11/11 Python
python语言time库和datetime库基本使用详解
2020/12/25 Python
美国廉价机票预订网站:Cheapfaremart
2018/04/28 全球购物
Lulu Guinness露露·吉尼斯官网:红唇包
2019/02/03 全球购物
美国围栏公司:Walpole Outdoors
2019/11/19 全球购物
测绘工程个人的自我评价
2013/11/10 职场文书
超市活动计划书
2014/04/24 职场文书
旅游专业毕业生自荐书
2014/06/30 职场文书
不尊敬老师的检讨书
2014/12/21 职场文书
2015年小学数学教师工作总结
2015/05/20 职场文书
在人间读书笔记
2015/06/30 职场文书
Redis 配置文件重要属性的具体使用
2021/05/20 Redis
Python编程编写完善的命令行工具
2021/09/15 Python