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


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 相关文章推荐
js GridView 实现自动计算操作代码
Mar 25 Javascript
自己动手制作jquery插件之自动添加删除行功能介绍
Oct 14 Javascript
javascript 获取iframe里页面中元素值的方法
Feb 17 Javascript
JavaScript 实现鼠标拖动元素实例代码
Feb 24 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
Aug 05 Javascript
jquery判断当前浏览器的实现代码
Nov 07 Javascript
JSON对象 详解及实例代码
Oct 18 Javascript
详解vue渲染从后台获取的json数据
Jul 06 Javascript
微信小程序 websocket 实现SpringMVC+Spring+Mybatis
Aug 04 Javascript
vue2.0 elementUI制作面包屑导航栏
Feb 22 Javascript
Vue 页面切换效果之 BubbleTransition(推荐)
Apr 08 Javascript
ajaxfileupload.js实现上传文件功能
Apr 19 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
php启动时候提示PHP startup的解决方法
2013/05/07 PHP
php获取textarea的值并处理回车换行的方法
2014/10/20 PHP
php微信公众平台开发类实例
2015/04/01 PHP
PHP实现的62进制转10进制,10进制转62进制函数示例
2019/06/06 PHP
jqgrid 编辑添加功能详细解析
2013/11/08 Javascript
nodeType属性返回被选节点的节点类型介绍
2013/11/22 Javascript
JS在IE下缺少标识符的错误
2014/07/23 Javascript
js+css简单实现网页换肤效果
2015/12/29 Javascript
基于jQuery倒计时插件实现团购秒杀效果
2016/05/13 Javascript
JS实现页面数据无限加载
2016/09/13 Javascript
javascript实现无法关闭的弹框
2016/11/27 Javascript
springMVC + easyui + $.ajaxFileUpload实现文件上传注意事项
2017/04/23 Javascript
Vue实现路由跳转和嵌套
2017/06/20 Javascript
如何编写一个完整的Angular4 FormText 组件
2017/11/18 Javascript
vue 引入公共css文件的简单方法(推荐)
2018/01/20 Javascript
JS装饰器函数用法总结
2018/04/21 Javascript
Vue组件之极简的地址选择器的实现
2018/05/31 Javascript
bootstrap table实现iview固定列的效果实例代码详解
2019/09/30 Javascript
vue实现树形结构样式和功能的实例代码
2019/10/15 Javascript
原生js拖拽实现图形伸缩效果
2020/02/10 Javascript
详尽讲述用Python的Django框架测试驱动开发的教程
2015/04/22 Python
关于Python中异常(Exception)的汇总
2017/01/18 Python
Python使用PyCrypto实现AES加密功能示例
2017/05/22 Python
Python TestCase中的断言方法介绍
2019/05/02 Python
python numpy数组中的复制知识解析
2020/02/03 Python
解决python -m pip install --upgrade pip 升级不成功问题
2020/03/05 Python
python实现手势识别的示例(入门)
2020/04/15 Python
Django执行源生mysql语句实现过程解析
2020/11/12 Python
Jogun Shop中文官网:韩国知名时尚男装网站
2016/10/12 全球购物
加拿大户外探险购物网站:SAIL
2020/06/27 全球购物
市三好学生主要事迹
2014/01/28 职场文书
2014年体育教学工作总结
2014/12/09 职场文书
2015年销售助理工作总结
2015/05/11 职场文书
小学六年级毕业感言
2015/07/30 职场文书
2016党员学习作风建设心得体会
2016/01/21 职场文书
化工生产实习心得体会
2016/01/22 职场文书