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


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 相关文章推荐
thinkphp中常用的系统常量和系统变量
Mar 05 Javascript
jQuery制作简单柱状图实例
Jan 28 Javascript
jQuery定义插件的方法
Dec 18 Javascript
location.hash保存页面状态的技巧
Apr 28 Javascript
js仿微信公众平台打标签功能
Apr 08 Javascript
underscore之Chaining_动力节点Java学院整理
Jul 10 Javascript
promise处理多个相互依赖的异步请求(实例讲解)
Aug 03 Javascript
ES6中字符串string常用的新增方法小结
Nov 07 Javascript
Vue项目分环境打包的实现步骤
Apr 02 Javascript
vue.js使用v-model实现表单元素(input) 双向数据绑定功能示例
Mar 08 Javascript
JavaScript实现简单计算器
Mar 19 Javascript
vue中三级导航的菜单权限控制
Mar 31 Vue.js
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/05/07 PHP
PHP form 表单传参明细研究
2009/07/17 PHP
PHP中使用gettext解决国际化问题的例子(i18n)
2014/06/13 PHP
详谈PHP中public,private,protected,abstract等关键字的用法
2017/12/31 PHP
IE6下拉框图层问题探讨及解决
2014/01/03 Javascript
原生JavaScript实现合并多个数组示例
2014/09/21 Javascript
Javascript中的匿名函数与封装介绍
2015/03/15 Javascript
超赞的jQuery图片滑块动画特效代码汇总
2016/01/25 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
vue调用高德地图实例代码
2017/04/28 Javascript
vue.js实现单选框、复选框和下拉框示例
2017/07/18 Javascript
vue2.0 elementUI制作面包屑导航栏
2018/02/22 Javascript
vue实现公共方法抽离
2020/07/31 Javascript
python网络编程之数据传输UDP实例分析
2015/05/20 Python
在Python中操作字典之clear()方法的使用
2015/05/21 Python
python编码最佳实践之总结
2016/02/14 Python
Python简单读写Xls格式文档的方法示例
2018/08/17 Python
Python使用Shelve保存对象方法总结
2019/01/28 Python
Python对ElasticSearch获取数据及操作
2019/04/24 Python
pip指定python位置安装软件包的方法
2019/07/12 Python
python实现的读取网页并分词功能示例
2019/10/29 Python
python对文件的操作方法汇总
2020/02/28 Python
Python Tkinter图形工具使用方法及实例解析
2020/06/15 Python
python 元组和列表的区别
2020/12/30 Python
利用Python实现自动扫雷小脚本
2020/12/17 Python
Python 获取异常(Exception)信息的几种方法
2020/12/29 Python
CSS3绘制六边形的简单实现
2016/08/25 HTML / CSS
Html5定位终极解决方案
2020/02/05 HTML / CSS
美国流行背包品牌:JanSport(杰斯伯)
2018/03/02 全球购物
如果NULL定义成#define NULL((char *)0)难道不就可以向函数传入不加转换的NULL了吗
2012/02/15 面试题
实习单位接收函模板
2014/01/10 职场文书
中学生自我评价范文
2014/02/08 职场文书
2014年迎新年活动方案
2014/02/19 职场文书
周年庆典答谢词
2015/01/20 职场文书
2019年英语版感谢信(8篇)
2019/09/29 职场文书
Go语言编译原理之变量捕获
2022/08/05 Golang