微信小程序开发技巧总结(持续更新...)(代码片段)

关键词：

小程序开发技巧总结

结合自己在平时的开发中遇到的各种问题，和浏览各种问题的解决方案总结出一些自己在日常开发中常用的技巧和知点,希望各位不吝斧正。

数据的生命周期

1.短生命周期数据存储

以小程序启动到彻底关闭为周期的的数据建议存储在app.js文件夹中,引用app.js:

const app =getApp();

假设Value是在小程序本次生命周期中经常使用到的一个数据，比如说请求API的Token，动态的令牌等。那么就可以把这个值赋值到全局变量中去。实际上，并不是只有app.js中的globalData是全局变量，可以自己定义数据集。

App(
  eduOS:
    token:''
  ,
  ...
)

对于app.js里面的token进行赋值操作很简单,只要页面引用了app.js

app.eduOS.token = Value;

这个数据在小程序的本次启动到彻底关闭后台的周期中就是长期存在的了，还可以根据需要进行修改，Value可以是对象。

2.长生命周期或者隐私数据存储

这种数据的显著特点是在小程序关闭再次重启后依然存在，或者涉及到用户的隐私信息但是需要复用，这种时候可以用本地缓存来解决这种问题。

本地缓存的生命周期: 小程序被开始使用 -----> 小程序被彻底从使用列表中移除。

小程序设置缓存的方式：

wx.setStorage(
            key: 'educookie',
            data: 
              xh: that.data.xh,
              pwd: that.data.pwd
            
          )

小程序获取缓存的方式:

 var that = this;
 wx.getStorage(
      key: 'educookie',
      success: function(res) 
        that.setData(xh:res.data.xh,pwd:res.data.pwd);
      ,
    )

比如保存用户的登陆态信息，但是不能保存用户的隐私数据，就可以采用这种方式。

或者是一个非时效性的数据，可以通过这种方式进行存储。

3.动态信息或配置信息存储

保存用户的配置信息，在更换手机时能迅速完成配置同步。

商家小程序推荐商品修改，或者是内容修正，或者是增加活动，不可能每次都要重写然后再次让小程序进行审核。

对此，可以在后端服务器中保存这个信息。

以一个小程序的轮播广告牌为例:

 ad1:'imgurl1',
 ad2:'imgurl2',
 ad3:'imgurl3'

把这个数据存放在后台服务器，每一次刷新该页面都请求一次后台数据，对内容进行修改。

wx.request(
    url:'XXX',
    data:,
    success(res)
        that.setData(
            adList:res.data
        )
    
)

类似这种方式，完成对一些数据的动态控制或者是云同步。

4.页面间数据传递

页面间之间的数据传递一般是简单的，这种类型的数据的生命周期是一次性的，用完即删。

wx.navigatorTo(
    url:'../index/index?param1=value1&param2=value2'
)

//在index页面获取
onLoad(options)
    console.log(options.param1);//value1

可以参照Http请求中的Get表单传参方式来写页面之间的传参。

如果需要传送的数据太多，可通过Map<key ，Storge>进行传递

wx.setStorge(
    key:'xxx',
    data:mydata
)

传递参数只需要传递一个key，在其他界面通过这个key再次去除本地缓存，对于这种类型的数据，建议使用完后即时的删除缓存。

wx.removeStorage(
  key: 'xxx',
  success(res) 
    console.log(res)
  
)

微信小程序开发常见问题总结(代码片段)

        最近在做微信小程序开发，遇到了一些常见的问题，现总结一下。        1、text标签文字首行缩进。.testTexttext-indent:2em;        2、改变radio的默认大小。radiotransform:scale(0.6);       3、三目运算不起... 查看详情

微信小程序开发bug经验总结(代码片段)

摘要：常见的微信小程序BUG！小程序开发越来越热，开发中遇到各种各样的bug，在此总结了一些比较容易掉进去的坑分享给大家。1.newDate跨平台兼容性问题在Andriod使用newDate(“2018-05-3000:00:00”)木有问题，但是在ios下面识别不出... 查看详情

微信小程序开发02：项目开发总结(代码片段)

1.bilibili项目介绍通过原生的微信小程序来实现一个bilibili应用，来体验原生小程序魅力。2.技术铺垫html和css和JavaScript基本功部分es6微信小程序基础3.关键技术名称链接备注微信小程序开发文档官方文档4.成果5.接口地址公共路... 查看详情

微信小程序开发常见问题总结(代码片段)

        最近在做微信小程序开发，遇到了一些常见的问题，现总结一下。        1、text标签文字首行缩进。.testTexttext-indent:2em;        2、改变radio的默认大小。radiotransform:scale(0.6);       3、三目运算不起... 查看详情

微信小程序开发基础「配置」与「逻辑层」(代码片段)

微信小程序作为微信生态重要的一环，在实际生活、工作、商业中的应用越来越广泛。想学习微信小程序开发的朋友也越来越多，本文将在小程序框架的基础上就微信小程序项目开发所必需的基础知识及语法特点进行了详细总结... 查看详情

微信小程序开发知识点总结(代码片段)

微信小程序开发知识点总结微信小程序的目录结构1.外联公共样式的方法根据微信的官方文档，是支持@import的方式一如外联的公共样式的使用@import语句可以导入外联样式表，@import后跟需要导入的外联样式表的相... 查看详情

小程序开发另类小技巧--用户授权篇(代码片段)

...：而小程序内只有第一次进行授权时才会主动激活弹窗（微信提供的），其他情况下都会直接走fail回调，微信文档也在句末添加了一句请开发者兼容用户拒绝授权的场景,这种未做兼容的情况下如果用户想要使用录音功能，第一... 查看详情

mssql技巧总结--持续更新(代码片段)

使用Merge关键字做插入或更新操作Merge关键字可以进行2个表之间的更新。应用场景批量插入或更新数据；经销存更新库存表之间数据的复制等等语法说明MERGE目标表USING源表ON匹配条件WHENMATCHEDTHEN语句WHENNOTMATCHEDTHEN语句;说明：最末... 查看详情

原创经验：微信小程序开发总结(代码片段)

学习时间不短了.今天公司不加班总结一下我的开发经验吧,以下都是我认为很重要的总结哦!写下来让我自己也记得更清楚,同时希望可以帮助到有需要的同学哦一:参数传值的方法1:data-id我们可以给HTML元素添加data-*属性来传递我们... 查看详情

11.20小程序开发总结(代码片段)

小程序接口：1.getCurrentPages 获取页面前几个页面的所有app.js信息（太强了！！我竟然才知道）  用途：获取上个页面的函数来获取做数据交互,类似react父级给子级传参,函数等.　代码:varpages=getCurrentPages();varprevPage=pages[p... 查看详情

微信小程序开发总结（附源代码）(代码片段)

最近公司项目不是很忙，有时间研究研究微信小程序。参考了目前市场上各类答题类的app、小程序等等，做了一款自己的微信答题小程序，包括前端和后端，后端是用node做的。现在已经上线了，名字叫【你问我猜猜猜】，大家... 查看详情

微信小程序开发(代码片段)

创建自己的微信小程序开发账号1.首先登录微信公众平台https://mp.weixin.qq.com/点击注册账号，按照提示完成需要填写的信息，并登录2.进入开发（1）在首页的左边的导航栏中，找到开发中的开发工具，进入微... 查看详情

第一个mpvue小程序开发总结(代码片段)

前言说起小程序，其实在去年我都还只试着照着官方文档写过demo的，不过现在这家公司小程序做得比较多，我来之后也参与了几个小程序的开发了，最开始那几个是用的wepy，最近一个开始转用mpvue开发，最近这个项目终于上线... 查看详情

微信小程序开发上线注意事项(代码片段)

微信小程序开发上线注意事项记录微信小程序开发及上线过程中需要注意的一些事项。一、准备工作1.抢注小程序名称只要想好要开发小程序后，就应该立刻进行小程序账号和名称的注册。及时验证小程序名称是否符合要求&#... 查看详情

小程序开发实践总结(代码片段)

从微信发布小程序以来，各大公司纷纷跟进都想从微信这个流量池里捞一杯羹。我司也不例外，我们整个前端团队这半年来基本上都是在开发小程序。前前后后也开发了四五个小程序了。总觉得要留下点什么，既是记录那些年我... 查看详情

微信小程序开发（笔记）(代码片段)

微信小程序开发笔记一、微信小程序的结构1、初识小程序2、快捷键二、常用组件1.input组件2.button组件三、小程序中的函数1.函数的两种定义方法1.函数在本页面的调用2.带参函数2.js中的默认函数四、点击事件五、获取用户输入六... 查看详情

微信小程序开发实战(云开发)--资产管理工具(代码片段)

添加首页menu页面截图展示menu.js源码 //pages/menu/menu.js Page( /** *页面的初始数据 */ data: , /** *生命周期函数--监听页面加载 */ onLoad:function(options) , 查看详情

微信小程序开发创建一个小程序helloworld！(代码片段)

开发微信小程序并不是很难，网上有很多小程序开发资料，尤其是微信官方的《小程序开发指南》最详细。下面是我开发小程序的历程：第一步，请前往https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 微信开发者工具下载... 查看详情