微信小程序 Storage API实例详解


Posted in Javascript onOctober 02, 2016

微信小程序 Storage API实例详解

其实这个存储在新建Demo的时候就已经用到了就是存储就是那个logs日志,数据存储主要分为同步和异步

异步存储方法:

存数据

wx.setStorage(object) 相同key会覆盖,可写回调方法

微信小程序 Storage API实例详解

获取方法:

wx.getStorage(object)

微信小程序 Storage API实例详解

清除方法:

wx.clearStorage()里面可以写回调函数 成功,失败,完成

同步存储方法:

存数据 相同key会覆盖

wx.setStorageSync(key,data)

读数据

wx.getStorageSync(key) 存储是指定的key

清除数据

wx.clearStorageSync() 不可写回调方法

wxml

<!--动态获取数据-->
<text>{{storageContent}}</text>
<!--存-->
<button type="primary" bindtap="listenerStorageSave">storage存储信息会在text上显示</button>
<!--取-->
<button type="primary" bindtap="listenerStorageGet">获取storage存储的信息</button>
<!--清-->
<button type="warn" bindtap="listenerStorageClear">清楚异步存储数据</button>


<text>{{storageSyncContent}}</text>
<button type="primary" bindtap="listenerStorageSyncSave">storageSync存储信息会在text上显示</button>
<button type="primary" bindtap="listenerStorageSyncGet">获取storageSync存储信息</button>
<button type="warn" bindtap="listenerStorageSyncClear">清除同步存储数据</button>

js

Page({
 data:{
  // text:"这是一个页面"
  storageContent: '',
  storageSyncContent: ''
 },
 onLoad:function(options){
  // 页面初始化 options为页面跳转所带来的参数
 },
 /**
  * 异步存储
  */
 listenerStorageSave: function() {
  //以键值对的形式存储 传进去的是个对象
  wx.setStorage({
   key: 'key',
   data: '我是storeage异步存储的信息',
   success: function(res) {
    console.log(res)
   }
  })
 },
 /**
  * 异步取信息
  */
 listenerStorageGet: function() {
  var that = this;
  wx.getStorage({
   //获取数据的key
   key: 'key',
   success: function(res) {
    console.log(res)
    that.setData({
     //
     storageContent: res.data
    })
   },
   /**
    * 失败会调用
    */
   fail: function(res) {
    console.log(res)
   }
  })
 },

 /**
  * 清除数据
  */
 listenerStorageClear: function() {
  var that = this;
  wx.clearStorage({
   success: function(res) {
    that.setData({
     storageContent: ''
    })
   }
  })
 },


 /**
  * 数据同步存储
  */
 listenerStorageSyncSave: function() {
  wx.setStorageSync('key', '我是同步存储的数据')
 },

 /**
  * 数据同步获取
  */
 listenerStorageSyncGet: function() {
  // var that = this;
  var value = wx.getStorageSync('key')
  this.setData({
   storageSyncContent: value
  })
 },

 /**
  * 清除同步存储数据
  */
 listenerStorageSyncClear: function() {
  wx.clearStorageSync()
 },

 onReady:function(){
  // 页面渲染完成
 },
 onShow:function(){
  // 页面显示
 },
 onHide:function(){
  // 页面隐藏
 },
 onUnload:function(){
  // 页面关闭
 }
})

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

Javascript 相关文章推荐
JavaScript打开word文档的实现代码(c#)
Apr 16 Javascript
Javascript字符串对象的常用方法简明版
Jun 26 Javascript
JavaScript+html5 canvas实现图片破碎重组动画特效
Feb 22 Javascript
jQuery配合coin-slider插件制作幻灯片效果的流程解析
May 13 Javascript
vue-cli入门之项目结构分析
Apr 20 Javascript
基于daterangepicker日历插件使用参数注意的问题
Aug 10 Javascript
Js 利用正则表达式和replace函数获取string中所有被匹配到的文本(推荐)
Oct 28 Javascript
Three.JS实现三维场景
Dec 30 Javascript
基于Vue实现电商SKU组合算法问题
May 29 Javascript
Electron vue的使用教程图文详解
Jul 05 Javascript
微信小程序音乐播放器开发
Nov 20 Javascript
webpack介绍使用配置教程详解webpack介绍和使用
Jun 25 Javascript
微信小程序 Video API实例详解
Oct 02 #Javascript
老生常谈JavaScript中的this关键字
Oct 01 #Javascript
ES6新特征数字、数组、字符串
Oct 01 #Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
Oct 01 #Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
Oct 01 #Javascript
javascript代码调试之console.log 用法图文详解
Sep 30 #Javascript
JS实现表单多文件上传样式美化支持选中文件后删除相关项
Sep 30 #Javascript
You might like
2020年4月放送决定!第2期TV动画《邪神酱飞踢》视觉图&主题曲情报公开!
2020/03/06 日漫
PHP源码分析之变量的存储过程分解
2014/07/03 PHP
php数组使用规则分析
2015/02/27 PHP
php学习笔记之mb_strstr的基本使用
2018/02/03 PHP
List Installed Software Features
2007/06/11 Javascript
jscript之List Excel Color Values
2007/06/13 Javascript
3款实用的在线JS代码工具(国外)
2012/03/15 Javascript
JavaScript代码复用模式详解
2014/11/07 Javascript
浅谈JavaScript中的作用域和闭包问题
2015/07/07 Javascript
JS实现黑客帝国文字下落效果
2015/09/01 Javascript
解决JS组件bootstrap table分页实现过程中遇到的问题
2016/04/21 Javascript
jQuery操作复选框(CheckBox)的取值赋值实现代码
2017/01/10 Javascript
angular+ionic 的app上拉加载更新数据实现方法
2017/01/16 Javascript
如何在 JavaScript 中更好地利用数组
2018/09/27 Javascript
详解mpvue小程序中怎么引入iconfont字体图标
2018/10/01 Javascript
详解小程序退出页面时清除定时器
2019/04/28 Javascript
微信小程序仿淘宝热搜词在搜索框中轮播功能
2020/01/21 Javascript
详解ES6实现类的私有变量的几种写法
2021/02/10 Javascript
[07:59]2014DOTA2叨叨刀塔 林熊猫称被邀请赛现场盛况震撼
2014/07/21 DOTA
Python标准异常和异常处理详解
2015/02/02 Python
编写Python脚本把sqlAlchemy对象转换成dict的教程
2015/05/29 Python
解决uWSGI的编码问题详解
2017/03/24 Python
[原创]python爬虫(入门教程、视频教程)
2018/01/08 Python
python使用tcp实现局域网内文件传输
2020/03/20 Python
Python实现钉钉发送报警消息的方法
2019/02/20 Python
python抓取需要扫微信登陆页面
2019/04/29 Python
Pandas 缺失数据处理的实现
2019/11/04 Python
python代码实现猜拳小游戏
2020/11/30 Python
南京某公司笔试题
2013/01/27 面试题
经典优秀个人求职信分享
2013/12/12 职场文书
三下乡活动方案
2014/01/31 职场文书
市场营销专业毕业生求职信
2014/07/21 职场文书
2014年学生会主席工作总结
2014/11/07 职场文书
担保书格式
2015/01/20 职场文书
2015年推广普通话演讲稿
2015/03/20 职场文书
2019七夕节祝福语36句,快来收藏吧
2019/08/06 职场文书