原文:微信小程序把玩(三十六)Storage API

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

异步存储方法:

存数据

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

获取方法:

wx.getStorage(object)

清除方法:

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(){
// 页面关闭
}
})

微信小程序把玩(三十六)Storage API的更多相关文章

  1. 微信小程序把玩(十六)form组件

    原文:微信小程序把玩(十六)form组件 form表单组件 是提交form内的所有选中属性的值,注意每个form表单内的组件都必须有name属性指定否则提交不上去,button中的type两个subm ...

  2. 微信小程序把玩(十八)picker组件

    原文:微信小程序把玩(十八)picker组件 picker选择器分为三种,普通选择器,时间选择器, 日期选择器 用mode属性区分,默认是普通选择器.测试时时间和日期点击无反应不知道是BUG还是啥!没 ...

  3. 微信小程序把玩(十九)radio组件

    原文:微信小程序把玩(十九)radio组件 radio组件为单选组件与radio-group组合使用,使用方式和checkbox没啥区别 主要属性: wxml <!--设置监听器,当点击radi ...

  4. 微信小程序把玩(十五)checkbox组件

    原文:微信小程序把玩(十五)checkbox组件 不得不吐糟下checkbox默认样式真是有点略丑!!!checkbox组件为一个多选框被放到checkbox-group组中,并在checkbox-g ...

  5. 微信小程序把玩(十二)text组件

    原文:微信小程序把玩(十二)text组件 通常文本设置要不在wxml中设置,再要不就是通过weml绑定在js中设置文字. wxml <view > <text>我是文本组件&l ...

  6. 微信小程序把玩(十四)button组件

    原文:微信小程序把玩(十四)button组件 button按钮用的算是最普遍的组件之一. 主要属性: wxml <!--按钮默认样式,点击事件--> <button type=&qu ...

  7. 微信小程序把玩(十)swiper组件

    原文:微信小程序把玩(十)swiper组件 Android写过轮播图的痛楚只有写过的知道,相对还是比较麻烦的,并没有一个轮播图组件,有个ViewPage也需要自己定制,IOS则多用UIScroller ...

  8. 微信小程序把玩(三)tabBar底部导航

    原文:微信小程序把玩(三)tabBar底部导航 tabBar相对而言用的还是比较多的,但是用起来并没有难,在app.json中配置下tabBar即可,注意tabBar至少需要两个最多五个Item选项 ...

  9. 微信小程序把玩(三十四)Audio API

    原文:微信小程序把玩(三十四)Audio API 没啥可值得太注意的地方 重要属性: 1. wx.getBackgroundAudioPlayerState(object) 获取播放状态 2.wx.p ...

随机推荐

  1. 数据序列化之protobuf

    数据序列化之protobuf 很多时候需要将一些数据打包,就是把这些数据搞在一起,方便处理.最常见的情况就是把需要传输的数据,当然数据不止一条,打包成一个消息,然后发送出去,接收端再以一定的规则接收并 ...

  2. Erlang 位串和二进制数据

    http://blog.chinaunix.net/xmlrpc.php?r=blog/article&uid=25876834&id=3300393 因为在本人工作中,服务端Erla ...

  3. NOIP 模拟 玩积木 - 迭代加深搜索 / bfs+hash+玄学剪枝

    题目大意: 有一堆积木,0号节点每次可以和其上方,下方,左上,右下的其中一个交换,问至少需要多少次达到目标状态,若步数超过20,输出too difficult 目标状态: 0 1 1 2 2 2 3 ...

  4. 生成动态Lambda表达式1

    SqlDataReader生成动态Lambda表达式 上一扁使用动态lambda表达式来将DataTable转换成实体,比直接用反射快了不少.主要是首行转换的时候动态生成了委托. 后面的转换都是直接调 ...

  5. VS Code插件之Cordova Tools

    原文:VS Code插件之Cordova Tools 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u011127019/article/detai ...

  6. Vue Router的官方示例改造

    基于Vue Router 2018年8月的官方文档示例,改造一下,通过一个最简单的例子,解决很多初学者的一个困惑. 首先是官方文档示例代码 <!DOCTYPE html> <html ...

  7. JTextpane 加入的行号

    最近项目需求,在需求JTextPane加入行号等信息,网上找了半天才发现JTextArea加入行号信息.copy正在研究在线程序.他发现自己能够做出改变来改变JTextPane显示行号. 代码: pa ...

  8. create-react-app 支持 装饰器 decorator

    网上常见方法全是安装 babel-plugin-transform-decorators-legacy 然后添加babel配置的, 实际情况是最新版本的create-react-app 生成的项目已经 ...

  9. so文件成品评论【整理】

    这是我的 @布加迪20 AZ在一篇文章中写道:<汉化so文件的心得>中的技术附件做的简洁性整理.原来的看起来不是非常方便.一起分享学习.. 正文 SO文件汉化心得 --By布加迪20   ...

  10. Windows下如何采用微软的Caffe配置Faster R-CNN

    前言 比较简单的一篇博客.https://github.com/microsoft/caffe 微软的Caffe以在Windows下编译简单而受到了很多人的喜爱(包括我),只用改改prop配置然后无脑 ...