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


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实现点击TreeView文本父节点展开/折叠子节点
Jan 10 Javascript
用box固定长宽实现图片自动轮播js代码
Jun 09 Javascript
Jquery Post处理后不进入回调的原因及解决方法
Jul 15 Javascript
使用jQuery不判断浏览器高度解决iframe自适应高度问题
Dec 16 Javascript
基于jquery实现导航菜单高亮显示(两种方法)
Aug 23 Javascript
JQuery实现级联下拉框效果实例讲解
Sep 17 Javascript
jquery表单验证插件formValidator使用方法
Apr 01 Javascript
AngularJS表单提交实例详解
Feb 18 Javascript
Three.js利用顶点绘制立方体的方法详解
Sep 27 Javascript
在vue项目中使用sass的配置方法
Mar 20 Javascript
vue cli 3.0 使用全过程解析
Jun 14 Javascript
vue src动态加载请求获取图片的方法
Oct 17 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 动态执行带有参数的类方法
2009/04/10 PHP
简单的php写入数据库类代码分享
2011/07/26 PHP
PHP中is_dir()函数使用指南
2015/05/08 PHP
详细解读PHP的Yii框架中登陆功能的实现
2015/08/21 PHP
PHP环境搭建(php+Apache+mysql)
2016/11/14 PHP
phpStudy中升级MySQL版本到5.7.17的方法步骤
2017/08/03 PHP
php实现的mongoDB单例模式操作类
2018/01/20 PHP
解决php用mysql方式连接数据库出现Deprecated报错问题
2019/12/25 PHP
学习YUI.Ext 第六天--关于树TreePanel(Part 1)
2007/03/10 Javascript
JavaScript setTimeout和setInterval的使用方法 说明
2010/03/25 Javascript
jquery foreach使用示例
2013/09/12 Javascript
JavaScript实现常用二级省市级联下拉列表的方法
2015/03/25 Javascript
详解angular分页插件tm.pagination二次触发问题解决方案
2018/07/20 Javascript
vue实现下拉菜单树
2020/10/22 Javascript
vue使用exif获取图片经纬度的示例代码
2020/12/11 Vue.js
[54:05]DOTA2-DPC中国联赛定级赛 SAG vs iG BO3第一场 1月9日
2021/03/11 DOTA
Python实现冒泡排序的简单应用示例
2017/12/11 Python
对pandas中时间窗函数rolling的使用详解
2018/11/28 Python
python3在同一行内输入n个数并用列表保存的例子
2019/07/20 Python
Python3使用tesserocr识别字母数字验证码的实现
2021/01/29 Python
python自动化办公操作PPT的实现
2021/02/05 Python
css3学习心得分享
2013/08/19 HTML / CSS
Gap英国官网:Gap UK
2018/07/18 全球购物
XD健身器材:Kevlar球、Crossfit健身球
2019/03/26 全球购物
医学生求职自荐信
2013/10/25 职场文书
表彰先进集体通报
2014/01/12 职场文书
医药个人求职信范文
2014/01/29 职场文书
节能标语大全
2014/06/21 职场文书
学校百日安全生产活动总结
2014/07/05 职场文书
2014年社区计生工作总结
2014/11/18 职场文书
教师正风肃纪心得体会
2016/01/15 职场文书
2016计算机专业毕业生自荐信
2016/01/28 职场文书
公司与个人合作协议书
2016/03/19 职场文书
60条职场经典语录,总有一条能触动你的心
2019/08/21 职场文书
java实现对Hadoop的操作
2021/07/01 Java/Android
中国十大神话动漫电影排行榜 哪吒登顶 白蛇缘起排第七
2022/03/21 国漫