解决方案

来客小课堂|微信小程序开发小知识点讲解(一)

作者:仙宝云 | 发布时间:2021-07-21 18:30:37 | 阅读:655

来客小程序商城,数十种促销工具,有助于晋升商号成交转化商家可以自由创立各种促销活动,例如秒杀、拼团、竞拍、优惠券、砍价、积分兑换等商品秒杀可以吸引人气并增加访问量;全民拼团可以一秒钟打开交际营销大门,清理库存,加速资金回流通过砍价营销进行全面推广;兑换积分可以保护新老客户

来客小课堂开讲啦,此文讲授的是微信小程序的小知识点,大家做好笔记哦!

subPackages 分包加载

因为小程序主担保大小不超越2M 限制,所以利用分包是个不错的选择,总分包大小不超越8M,可以添加大都个分包,分包加载可以优化小程序首次启动的下载工夫,当进入分包页面再进行下载,这种按需加载可以把某些数据量大的抽离出来放入分包

rpx 单位

在做移动端最常用适配的方式就是使用 rem 或 vw 作为单位来进行适配,所以微信小程序提供了 rpx 单位来进行适配

授权弹窗

wx.getUserInfo 接口调整,以前可以直接主动调用显示授权弹窗 ,现在需要运用 <button open-type=”getUserInfo”></button> 点击来引导用户去授权,小程序 wx.getUserInfo 接口正式版已调整,体验版和开发版还可以运用原有方法

原生组件 z-index

原生组件的层级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都回天乏术盖在原生组件上,可以经过 cover-view 来解决,但某些特定环境假如 swiper 或弹窗中需要显隐原生组件,需要配合 hidden 来运用

伪元素

小程序的伪元素属性回天乏术在微信开发者工具 css 属性中看到,所以对于某些组件样式回天乏术掩盖常常(假如 button 的边框或某些线条设置),是因为通过伪元素 ::after 设置的,所以必须运用伪元素来掩盖

页面栈

一个应用同时只能打开5个页面栈,当已经打开了5个页面之后(现在限定是10层),后续可能出现不能正常打开新页面wx.navigateTo 跳转见面保存当前页面,wx.redirectTo 则不会,所以恳求幸免多层级的交互方法来合理应用跳转方法

组件化

emplate 模块与 component 组件,是小程序中组件化的方法,二者的区分是,template 模块首要是展示,办法需要在利用 template 的页面中界说而 component 组件,则具有自己的js 文件,全部 component 组件近似一个 page 页面简略来说,只是展示用,提议利用 template,组件中波及到较多的逻辑,提议利用 component

调式

  • 开发者工具 source 断点调式、console.log 打印数据和 AppData 查看数据
  • 小程序留意当前调式根底库版来调式一些兼容性以及 bug 题目
  • 小程序先在开发版或体验版右上比赛打开调试显示 vConsole,再切到正式版就能看到 vConsole 模式

数据传送

  • 应用数据缓存,wx.setStorage 和 wx.getStorage,存储数据只能是字符串格式,所以一般设置经常需要利用 JSON.stringfy 来把对象改变字符串,获得常常运用 JSON.parse 来复原成对象
  • wx.navigateTo 跳转传送参数,在跳转 url 后拼接字符串,在 onLoad() 函数内,经过 options.参数名 的方法获得传送的参数,留意如果有特殊字符(假如?#等),可以运用encodeURIComponent 和 decodeURIComponent 编码和解码,否则会面被截断,致使特殊字符后面的数据回天乏术传送
  • getCurrentPages() 函数用于获得当前页面栈的实例,可以获得页面栈或修改页面栈数据
  • getApp() 可以获得全局对象和方式

导航栏胶囊对齐适配

导航栏一般运用自定义,比较灵巧可控,首先需要 app.json 中设置 navigationStyle :custom 自定义,然后通过小程序 wx.getMenuButtonBoundingClientRect() 可以获得到右上比赛胶囊菜单位置信息,不过这个接口不稳定,局部机型会出现获得失败的 bug,所以利用 wx.getSystemInfo 来获得该设备的状态栏高度(即使手机工夫和电量那一栏高度),标题栏高度(即包罗导航返回键、标题和胶囊的高度)默认设置安卓为48,ios 为44(小程序默认胶囊在安卓中为48px 的标题栏居中,因为安卓类别比较大都,所以会晤有点差异,ios 为44px 的标题栏居中),导航栏总高度为状态栏高度+标题栏高度,padding-top 高度为状态栏高度,标题栏中元素垂直对齐来达到适配并与胶囊对齐,设置内容高度常常可以应用 calc(100vh – 导航栏总高度),把样式放在全局 app.wxss 中

unionid 标识

unionid 是小程序用户的跨程序标识,领有 unionid 首先需要绑定微信开放平台(微信开放平台-管理平台-小程序-绑定小程序),因为 unionid 就是微信开放平台分发下来的,不将小程序绑定微信开放平台,就没有 unionid,当不同小程序的 unionid 是不同的,需要把小程序挂载到同一个主体中,同一用户,对同一个微信开放平台下的不同应用,unionid 是雷同的

后台返回 unionid 给前端:首先 wx.login 获得用户登录凭据code,然后 wx.getSetting 查看是否已授权,wx.getUserInfo 获得用户信息,通过用户信息的加密字段给后台向微信服务器换取 unionid 返回,由于获得恳求返回数据可能会在 Page.onLoad 之后才返回, 所以一般加上 callback (获得 unionid 一般放在 app.js 的 onLaunch 中,所以需要 callback 来处理 它和页面 onLoad 的数据获得)

接口恳求

提议把所有恳求抽离到同一个 api.js 中,可以便利后期的修改和排查题目,小程序恳求是通过微信后台来恳求我们的后台地点来进行后端映照、你恳求的接口实际到微信的后端做了一道映照,微信后端拿到你的 wx.request 调用的 url、用后端恳求后端,所以不会出现跨域题目

input 键盘

考虑不同场景运用不同的 type,若是文本键盘,数字键盘来提高用户体验

wux-weapp

小程序组件比较引荐 wux-weapp,组件丰富并且拓展灵敏


<仙宝云(www.xianboss.com)是国内著名商城体系及商城网站建设提供商,为企业级商家提供零售商城、B2B2C多用户商城系统、仙宝云商城体系、微信分销体系、小程序商城、商城体系等多端商城网站建设解决方案>

申明:本网站局部文章和图片起源网络编辑,如有侵权及时沟通删除,神仙宝商城原创文章,转载恳求注明根源

智慧商业服务商仙宝云欢迎您!

请加微信: 18962171986 (宋经理)

在线咨询