文档章节

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

Mr韦淋
 Mr韦淋
发布于 2017/05/07 20:22
字数 451
阅读 4
收藏 0

这里写图片描述

其实这个存储在新建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(){
    // 页面关闭
  }
})

本文转载自:http://blog.csdn.net/u014360817/article/details/52704328

共有 人打赏支持
Mr韦淋
粉丝 2
博文 80
码字总数 23114
作品 0
江门
高级程序员
私信 提问
微信小程序商城更新最新版 v1.2.2

微信小程序商城更新最新版 v1.2.2,主要改进内容包括: 1、 修复js循环异步加载API时候导致的变量异常; 2、增加后台发布商品选择使用快递时候下单的支持; 3、物流快递费用支持按件数和按重...

javazj
2017/07/30
1K
4
前端资源系列(3)-微信小程序开发资源汇总

微信(小程序or应用号)开发资源汇总-文档-工具-教程-代码-插件-组件 文档 从搭建一个微信小程序开始 小程序开发文档 小程序设计指南 工具 小程序开发者工具 - 官方 Egret Wing 3.2.x 支持微信...

xzavier
08/27
0
0
小程序api的promisefy

需求背景 微信小程序的大部分api是异步的。 简单地举个🌰: wx.showToast(Object object) 事实上这样的api 写的真够好,但是对于使用者来说并不友好。所以,为了方便同事们更加舒爽地去写代...

兔大大
12/03
0
0
美团外卖小程序的探索和实践(演讲内容整理)丨掘金开发者大会

2017年1月9日,微信官方在2017微信公开课Pro上发布的小程序正式上线,开创了小程序开发的时代。我们的美团外卖的业务也逐步加入到小程序开发的队伍中。小程序有着无需安装、触手可及、用完即...

掘金官方
09/25
0
0
【掘金开发者大会】美团外卖小程序的探索和实践

2017年1月9日,微信官方在2017微信公开课Pro上发布的小程序正式上线,开创了小程序开发的时代。我们的美团外卖的业务也逐步加入到小程序开发的队伍中。小程序有着无需安装、触手可及、用完即...

美团技术团队
09/19
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Deepin 安装wireshark抓包工具

一、关于deepin和wireshark deepin目前已经发展到15.8了,开发Android毫无压力,在四个月的使用时间里,已经非常习惯了。目前想处理一些网络问题,因此尝试在deepin上安装一个抓包工具。dee...

IamOkay
29分钟前
5
0
Docker镜像仓库服务-Nexus

建立云原生集群系统,建立自己的私有Docker镜像仓库必不可少。一方面可以加快多节点部署容器镜像的下载速度,另一方面是为了安全(容器里存储有系统所有的信息、包括密码、数据库等等,切记不...

openthings
41分钟前
1
0
127.0.0.1 和 0.0.0.0 地址的区别

1. IP地址分类 1.1 IP地址表示 IP地址由两个部分组成,net-id和host-id,即网络号和主机号。 net-id:表示ip地址所在的网络号。 host-id:表示ip地址所在网络中的某个主机号码。 即: IP-a...

华山猛男
今天
22
0
解决Unknown host 'd29vzk4ow07wi7.cloudfront.net'. You may need to adjust the proxy settings in Gradle.

把 总项目 下的 build.gradle 中的 两个 jcenter() 用 maven{ url ‘http://maven.aliyun.com/nexus/content/groups/public/’} 代替。...

lanyu96
今天
6
0
基于redis的分布式锁

redisson提供了基于redis的分布式锁实现方式,本文就尝试了下锁的使用方式。Redisson同时还为分布式锁提供了异步执行的相关方法,第二节执行介绍。 一、可重入锁验证 同一个jvm里面同一线程的...

noob_chr
今天
15
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部