微信小程序 本地数据读取实例


Posted in Javascript onApril 27, 2017

微信小程序 本地数据读取实例

一般情况下,小程序的utils这个文件夹下,我们可以把本地的数据写进去,封装成.js文件,提供对外暴露的接口,然后读取本地数据。如果涉及到一些针对这些数据的处理方法,也可以把方法写好,封装到.js文件里面,然后需要时调用。

module.exports = { 
  mtData: mtData, 
  searchmtdata: searchmtdata, 
  usedraw: usedraw 
} 
var mt_data = mtData() 
function searchmtdata(id) { 
  var result 
  for (let i = 0; i < mt_data.list.length; i++) { 
    var mt = mt_data.list[i] 
    if (mt.id == id) { 
      result = mt 
    } 
  } 
  return result || {} 
} 
 
function mtData() { 
  var arr = { 
    list: [ 
      { 
        id: '1', 
        MTId: 'MT001', 
        status: 'working', 
        Duration: 3, 
        Operator: 'tom', 
        IdleReason: 'lunch' 
      }, { 
        id: '2', 
        MTId: 'MT002', 
        status: 'Idle', 
        Duration: 7, 
        Operator: 'jerry', 
        IdleReason: 'reparied' 
      }, { 
        id: '3', 
        MTId: 'MT003', 
        status: 'Idle', 
        Duration: 6, 
        Operator: 'tom', 
        IdleReason: 'lunch' 
      }, { 
        id: '4', 
        MTId: 'MT004', 
        status: 'working', 
        Duration: 9, 
        Operator: 'jerry', 
        IdleReason: 'reparied' 
      }, { 
        id: '5', 
        MTId: 'MT005', 
        status: 'Idle', 
        Duration: 2, 
        Operator: 'tom', 
        IdleReason: 'lunch' 
      }, { 
        id: '6', 
        MTId: 'MT006', 
        status: 'working', 
        Duration: 6, 
        Operator: 'jerry', 
        IdleReason: 'reparied' 
      }, { 
        id: '7', 
        MTId: 'MT007', 
        status: 'Idle', 
        Duration: 1, 
        Operator: 'tom', 
        IdleReason: 'lunch' 
      } 
    ] 
  } 
  return arr 
}

如上面的代码片段所示,function mtData写好的本地数据,其中包含对象List。另外还有一个function searchmtdata,这个方法是根据传参的不同加载具体的数据,接下来会用到,方法和数据都写好后,需要写一个对外暴露的接口:

module.exports = { 
  mtData: mtData, 
  searchmtdata: searchmtdata, 
  usedraw: usedraw 
}

在其他页面调用data文件(一般是在js文件里面)

var fileData = require('../../utils/data.js') 
Page({ 
 data: { 
  showData: fileData.mtData().list, 
 }, 
})

像上面的示例一样,在data{}中赋值后,showData就可以直接在wxml中显示了。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
JQuery 插件模板 制作jquery插件的朋友可以参考下
Mar 17 Javascript
浅析return false的正确使用
Nov 04 Javascript
基于BootStrap Metronic开发框架经验小结【七】数据的导入、导出及附件的查看处理
May 12 Javascript
jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍
Sep 01 Javascript
简单分析javascript中的函数
Sep 10 Javascript
Js中async/await的执行顺序详解
Sep 22 Javascript
基于webpack 实用配置方法总结
Sep 28 Javascript
微信小程序自定义弹窗wcPop插件
Nov 19 Javascript
JavaScript实现Tab选项卡切换
Feb 13 Javascript
js中!和!!的区别与用法
May 09 Javascript
Vue-cli assets SubDirectory及PublicPath区别详解
Aug 18 Javascript
vant-ui组件调用Dialog弹窗异步关闭操作
Nov 04 Javascript
js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前
Apr 27 #Javascript
js获取浏览器的各种属性
Apr 27 #Javascript
jQuery鼠标悬停内容动画切换效果
Apr 27 #jQuery
详解axios在node.js中的post使用
Apr 27 #Javascript
使用jQuery,Angular实现登录界面验证码详解
Apr 27 #jQuery
js绑定事件和解绑事件
Apr 27 #Javascript
详解ECMAScript6入门--Class对象
Apr 27 #Javascript
You might like
基于mysql的bbs设计(二)
2006/10/09 PHP
ajax在joomla中的原生态应用代码
2012/07/19 PHP
php读取der格式证书乱码解决方法
2015/06/22 PHP
浅谈PHP中的数据传输CURL
2016/09/06 PHP
弹出模态框modal的实现方法及实例
2017/09/19 PHP
PHP+MariaDB数据库操作基本技巧备忘总结
2018/05/21 PHP
PHP一致性hash分布式算法封装类定义与用法示例
2018/08/04 PHP
解决Laravel5.5下的toArray问题
2019/10/15 PHP
JavaScript事件列表解说
2006/12/22 Javascript
return false;和e.preventDefault();的区别
2010/07/11 Javascript
javascript的字符串按引用复制和传递,按值来比较介绍与应用
2012/12/28 Javascript
js控制的遮罩层实例介绍
2013/05/29 Javascript
jquery获取tagName再进行判断
2014/05/29 Javascript
js控制页面的全屏展示和退出全屏显示的方法
2015/03/10 Javascript
原生JS实现风箱式demo,并封装了一个运动框架(实例代码)
2016/07/22 Javascript
浅谈jQuery hover(over, out)事件函数
2016/12/03 Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
2016/12/14 Javascript
ES6新数据结构Set与WeakSet用法分析
2017/03/31 Javascript
jQuery EasyUI 组件加上“清除”功能实例详解
2017/04/11 jQuery
微信小程序 滚动到某个位置添加class效果实现代码
2017/04/19 Javascript
微信小程序云开发之使用云数据库
2019/05/17 Javascript
python实现雨滴下落到地面效果
2018/06/21 Python
Django admin.py 在修改/添加表单界面显示额外字段的方法
2019/08/22 Python
Python 实现将numpy中的nan和inf,nan替换成对应的均值
2020/06/08 Python
北京振戎融通Java面试题
2015/09/03 面试题
如何定义一个可复用的服务
2014/09/30 面试题
毕业生文员求职信
2013/11/03 职场文书
消防安全管理制度
2014/02/01 职场文书
应届生自荐信范文
2014/02/21 职场文书
小学教师师德师风个人整改措施
2014/09/18 职场文书
机关领导干部作风整顿整改措施
2014/09/19 职场文书
财务总监岗位职责
2015/02/03 职场文书
产品质量保证书范本
2015/02/27 职场文书
七年级之家长会发言稿范文
2019/09/04 职场文书
如何用 Python 子进程关闭 Excel 自动化中的弹窗
2021/05/07 Python
php将xml转化对象的实例详解
2021/11/17 PHP