微信小程序如何修改本地缓存key中单个数据的详解


Posted in Javascript onApril 26, 2019

最近在做教师评教系统,有一个‘个人信息'页面中有个编辑修改邮箱的功能,本来想得很简单,结果进坑了,搞了好久才出来。

我想实现的效果是点击下图左侧邮箱,然后进入右侧页面,进行邮箱的修改,点击提交后跳转到左侧页面,同时邮箱也发生改变。

微信小程序如何修改本地缓存key中单个数据的详解

点击‘我的'时,我让它从控制台打印出student缓存中传过来的数据,如下:

{no: "1635050601", name: "张三", sex: "", email: "123@qq.com", classid: "100000-1602", …}
classid:"100000-1602"
classname:"16级PHP2"
departmentid:"100000"
departmentname:"软件学院"
name:"张三"
no:"1635050601"
sex:""

然后我添加邮箱后,后台接口写了方法让email的值直接存到student中,但是如果初次添加email的话可以实现,第二次修改email的话,就得想想该怎么从student里只修改email的值。

//表单提交
 formSubmit: function (e) {
 console.log(e.detail.value);
 var pwd = e.detail.value.pwd;
 var email = e.detail.value.email;
 if (pwd == '') {
  wx.showToast({
  title: '密码不能为空',
  icon: 'none',
  duration: 1000,
  })
 }else if (email == '') {
  wx.showToast({
  title: '邮箱不能为空',
  icon: 'none',
  duration: 1000,
  })
 }else {
  //post方式提交
  wx.request({
  url: app.globalData.url.bindemail,
  method: "POST",
  data: {
   no: this.data.no,
   pwd: pwd,
   email: email
  },
  header: {
   "Content-Type": "application/x-www-form-urlencoded"
  },
  success: function (res) {
   // console.log(res);
   if(res.data.error == true){
   wx.showToast({
    title: res.data.msg,
    icon: 'none',
    duration: 1000,
   })
   }else{
   //修改email
   var _student = wx.getStorageSync('student');
   _student.email = email;
   wx.setStorageSync('student', _student);
   
   wx.showToast({
    title: res.data.msg,
    icon: 'success',
    duration: 2000,
    success: function () {
    setTimeout(function () {
     wx.reLaunch({
     url: '../myinfo/myinfo',
     })
    }, 2000)
    }
   })
   }
  },
  })
 }
 },

这里我们用下边方法从student里只修改email的值。

//修改email
   var _student = wx.getStorageSync('student');
   _student.email = email;
   wx.setStorageSync('student', _student);

wx.setStorageSync(KEY,DATA)

将 data 存储在本地缓存中指定的 key 中,会覆盖掉原来该 key 对应的内容,这是一个同步接口。

wx.getStorageSync(KEY)

从本地缓存中同步获取指定 key 对应的内容。

如有问题或补充,欢迎小伙伴们留言哦~期待与你一同学习,共同进步!!!

以上所述是小编给大家介绍的微信小程序如何修改本地缓存key中单个数据详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js(JavaScript)实现TAB标签切换效果的简单实例
Feb 26 Javascript
禁用JavaScript控制台调试的方法
Mar 07 Javascript
input输入框鼠标焦点提示信息
Mar 17 Javascript
jQuery实现瀑布流布局详解(PC和移动端)
Sep 01 Javascript
基于javascript实现checkbox复选框实例代码
Jan 28 Javascript
jQuery Mobile页面返回不需要重新get
Apr 26 Javascript
JS JSOP跨域请求实例详解
Jul 04 Javascript
基于BootStrap栅格栏系统完成网站底部版权信息区
Dec 23 Javascript
vue中如何实现变量和字符串拼接
Jun 19 Javascript
WebSocket的通信过程与实现方法详解
Apr 29 Javascript
vue实现PC端录音功能的实例代码
Jun 05 Javascript
js实现有趣的倒计时效果
Jan 19 Javascript
js验证身份证号码记录的方法
Apr 26 #Javascript
详解VScode编辑器vue环境搭建所遇问题解决方案
Apr 26 #Javascript
react高阶组件添加和删除props
Apr 26 #Javascript
详解微信小程序-canvas绘制文字实现自动换行
Apr 26 #Javascript
vue 进阶之实现父子组件间的传值
Apr 26 #Javascript
详解JS判断页面是在手机端还是在PC端打开的方法
Apr 26 #Javascript
配置一个vue3.0项目的完整步骤
Apr 26 #Javascript
You might like
php mysql索引问题
2008/06/07 PHP
php与java通过socket通信的实现代码
2013/10/21 PHP
php使用cookie保存用户登录的用户名实例
2015/01/26 PHP
ThinkPHP设置禁止百度等搜索引擎转码(简单实用)
2016/02/15 PHP
yii的入口文件index.php中为什么会有这两句
2016/08/04 PHP
Javascript & DHTML 实例编程(教程)(三)初级实例篇1—上传文件控件实例
2007/06/02 Javascript
23个Javascript弹出窗口特效整理
2011/02/25 Javascript
js拦截alert对话框另类应用
2013/01/16 Javascript
jquery操作复选框(checkbox)的12个小技巧总结
2014/02/04 Javascript
node.js中的url.resolve方法使用说明
2014/12/10 Javascript
学习Bootstrap组件之下拉菜单
2015/07/28 Javascript
JavaScript检测并限制复选框选中个数的方法
2015/08/12 Javascript
JS控制HTML元素的显示和隐藏的两种方法
2016/09/27 Javascript
微信小程序之网络请求简单封装实例详解
2017/06/28 Javascript
深入理解Vuex 模块化(module)
2017/09/26 Javascript
详解vue项目打包后通过百度的BAE发布到网上的流程
2018/03/05 Javascript
webpack打包多页面的方法
2018/11/30 Javascript
js脚本中执行java后台代码方法解析
2019/10/11 Javascript
JavaScript常用工具函数库汇总
2020/09/17 Javascript
[07:43]《辉夜杯》公开赛晋级外卡赛战队—TRG训练生活探秘
2015/12/11 DOTA
[50:44]DOTA2-DPC中国联赛 正赛 SAG vs Dragon BO3 第二场 2月22日
2021/03/11 DOTA
浅谈PySpark SQL 相关知识介绍
2019/06/14 Python
Keras官方中文文档:性能评估Metrices详解
2020/06/15 Python
Python xmltodict模块安装及代码实例
2020/10/05 Python
Python监听键盘和鼠标事件的示例代码
2020/11/18 Python
python解包用法详解
2021/02/17 Python
详解CSS3原生支持div铺满浏览器的方法
2018/08/30 HTML / CSS
宝拉珍选官方旗舰店:2%水杨酸精华液,收缩毛孔粗大和祛痘
2018/07/01 全球购物
日语专业个人求职信范文
2014/02/02 职场文书
《盘古开天地》教学反思
2014/02/28 职场文书
祖国在我心中的演讲稿
2014/05/04 职场文书
高校优秀辅导员事迹材料
2014/05/07 职场文书
企业承诺书格式
2014/05/21 职场文书
全陪导游词开场白
2015/05/29 职场文书
2016秋季田径运动会广播稿
2015/12/21 职场文书
解决spring.thymeleaf.cache=false不起作用的问题
2022/06/10 Java/Android