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


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 select控制插件
Aug 17 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
Jul 01 Javascript
jquery操作cookie插件分享
Jan 14 Javascript
自己实现ajax封装示例分享
Apr 01 Javascript
全面理解闭包机制
Jul 11 Javascript
浅谈addEventListener和attachEvent的区别
Jul 14 Javascript
jQuery在ie6下无法设置select选中的解决方法详解
Sep 20 Javascript
SVG描边动画
Feb 23 Javascript
jQuery编写textarea输入字数限制代码
Mar 23 jQuery
vue-cli+webpack在生成的项目中使用bootstrap实例代码
May 26 Javascript
jquery-file-upload 文件上传带进度条效果
Nov 21 jQuery
javascript浅层克隆、深度克隆对比及实例解析
Feb 09 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的memcached客户端memcached
2011/06/14 PHP
php函数array_merge用法一例(合并同类数组)
2013/02/03 PHP
自己写了一个php检测文件编码的函数
2014/04/21 PHP
PHP中使用glob函数实现一句话删除某个目录下的所有文件
2014/07/22 PHP
ThinkPHP 3.2 版本升级了哪些内容
2015/03/05 PHP
PHP工程师VIM配置分享
2015/12/15 PHP
php json转换相关知识(小结)
2018/12/21 PHP
javascript入门·动态的时钟,显示完整的一些方法,新年倒计时
2007/10/01 Javascript
JSON 教程 json入门学习笔记
2020/09/22 Javascript
date.parse在IE和FF中的区别
2010/07/29 Javascript
关于jquery ajax 调用带参数的webservice返回XML数据一个小细节
2012/07/31 Javascript
关于eval 与new Function 到底该选哪个?
2013/04/17 Javascript
js中浮点型运算BUG的解决方法说明
2014/01/06 Javascript
indexOf 和 lastIndexOf 使用示例介绍
2014/09/02 Javascript
Javascript中的Callback方法浅析
2015/03/15 Javascript
js+css实现回到顶部按钮(back to top)
2016/03/02 Javascript
js改变css样式的三种方法推荐
2016/06/28 Javascript
Angular.JS判断复选框checkbox是否选中并实时显示
2016/11/30 Javascript
JavaScript 最佳实践:帮你提升代码质量
2016/12/03 Javascript
canvas实现动态小球重叠效果
2017/02/06 Javascript
jQuery日期范围选择器附源码下载
2017/05/23 jQuery
Angular中ng-options下拉数据默认值的设定方法
2017/06/21 Javascript
AngularJs+Bootstrap实现漂亮的计算器
2017/08/10 Javascript
NodeJS搭建HTTP服务器的实现步骤
2018/10/12 NodeJs
微信小程序动态设置图片大小的方法
2019/11/21 Javascript
Vue学习之组件用法实例详解
2020/01/06 Javascript
TypeScript的安装、使用、自动编译的实现
2020/04/10 Javascript
JS+CSS实现过渡特效
2021/01/02 Javascript
压缩包密码破解示例分享(类似典破解)
2014/01/17 Python
Python面向对象程序设计之私有属性及私有方法示例
2019/04/08 Python
Pytorch 实现冻结指定卷积层的参数
2020/01/06 Python
Swanson中国官网:美国斯旺森健康产品公司
2021/03/01 全球购物
电子商务专业个人的自我评价
2013/12/19 职场文书
优秀护士演讲稿
2014/04/30 职场文书
实习协议书范本
2014/09/25 职场文书
元旦晚会开场白
2015/05/29 职场文书