必应搜索引擎网站,手机网站 o2o,wordpress 加入js,直播软件排行榜前十名1. 配置分包加载以及打包、引用原则
小程序如果需要进行分包加载#xff0c;需要在 app.json 中#xff0c;通过 subPackages 或者 subpackages 定义分包结构
每个分包结构含三个常用字段#xff1a;
root#xff1a;分包的根目录#xff0c;该目录下的所有文件都会被打包…1. 配置分包加载以及打包、引用原则
小程序如果需要进行分包加载需要在 app.json 中通过 subPackages 或者 subpackages 定义分包结构
每个分包结构含三个常用字段
root分包的根目录该目录下的所有文件都会被打包成一个独立的包name分包的别名用于在代码中引用该分包pages指定当前分包中包含哪些页面
!-- 如果需要跳转到分包页面需要在路径之前加上分包的根目录路径 root 路径才行 --
navigator url/modules/goodModules/pages/list/list跳转到商品列表页面/navigatorsubPackages: [{root: modules/goodModules,name: goodModules,pages: [pages/list/list,pages/datail/detail]}]打包原则tabbar页面必须在主包内
最外层的pages字段属于主包的包含的页面
按subpackages配置路径进行打包配置路径外的目录将被打包到主包中
分包之间不能相互嵌套subpackage的根目录不能是另外一个subpackage内的子目录引用原则主包不可以引用分包的资源但分包可以使用主包的公共资源
分包与分包之间资源无法相互引用分包异步化时不受限制2. 独立分包的装置
独立分包指能够独立于主包和其他分包运行的包
当给subpackages定义的分包结构添加independent字段即可声明对应分包为独立分包
从独立分包中页面进入小程序时不用下载主包当用户进入普通分包或主包内页面时主包才会被下载。开发者可以将功能相对独立的页面配置到独立分包中因为独立分包不依赖主包就能运行使得分包页面启动速度更快。
{root: modules/marketModules,name:marketModules,pages: [pages/market/market],independent: true}注意事项
1独立分包中不能依赖主包和其他分包中的资源
2主包中的app.wxss对独立分包无效
3App只能在主包内定义独立分包中不能定义App,会造成严重的后果
3. 分包预下载
访问小程序页面时预先下载其他分包中的代码和资源提高用户体验
要在app.json中通过preloadRule字段设置预下载规则
preloadRule: {pages/index/index: {network: all,packages: [modules/goodModules]},modules/marketModules/pages/market/market: {network: all,packages: [__APP__]}}4. 获取微信头像
想使用微信提供的头像填写能力
将button组件open-type的值设置为chooseAvatar通过bindchooseavatar事件回调获取到头像信息的临时路径
// wxml
viewbutton classbtn open-typechooseAvatar bindchooseavatarchooseAvatarimage classavatar src{{ avatarUrl }} mode//button
/view// index.js
Page({data: {avatarUrl: ../../},// 获取微信头像chooseAvatar(event) {const { avatarUrl } event.datailthis.setData({avatarUrl})}
})5.获取微信昵称
想使用微信提供的昵称填写能力需要三步
通过 form 组件中包裹住 input 以及 form-type 为 submit 的 button 组件需要将 input 组件 type 的值设置为 nickname当用户输入框输入时键盘上方会展示微信昵称给 form 绑定 submit 事件在事件处理函数中通过事件对象获取用户昵称
form bindsubmitonSubmitinput typenickname namenickname placeholder请输入昵称/button typeprimary plain form-typesubmit点击获取昵称/button
/formonSubmit (event) {console.log(event.datail.value);}6.转发功能
帮助用户流畅的与好友分享内容和服务
方式一
页面.js必须声明onShareAppMessage事件监听函数并自定义转发内容。只有定义了此事件处理函数右上角菜单才会显示“转发”按钮
方式二
通过给button组件设置属性open-type“share”可以在用户点击按钮后触发Page.onShareAppMessage事件监听函数
如果通过按钮转发就有值如果通过右上角三个点转发就是undefined
onShareAppMessage (obj) {return {title: 这是一个非常神奇的画面,path: /miniprogram/pages/index/index.js,imageUrl: ../../assets/易烊千玺.jpg}}7.分享到朋友圈
要满足两个条件
页面必须设置允许“发送给朋友”,页面.js文件声明onShareAppMessage事件监听函数页面必须设置允许“分享到朋友圈”,页面.js文件声明onShareTimeline事件监听函数8. 手机号验证组件
手机号验证组件分为两种手机号快速验证组件 以及 手机号实时验证组件
手机号快速验证组件平台会对号码进行验证但不保证是实时验证
// 在event.detail中可以获取到codecode是动态令牌用来换区用户的手机号需要将code发送给后端后端接收后调用API换区用户真正的手机号再返回给前端
button open - typegetPhoneNumber bindgetphonenumbergetPhoneNumber手机号实时验证组件在每次请求时平台均会对用户选择的手机号进行实时验证。
button open - typegetRealtimePhoneNumber
bindgetrealtimephonenumbergetrealtimephonenumber /注意事项
目前该接口针对非个人开发者且完成了认证的小程序开放不包含海外主体
两种验证方式要付费使用有1000次的免费额度
9. 客服功能
使用方式
需要将button组件open-type的值设置为contact当用户点击就会进入客服会话在微信公众后台绑定后的客服账号可以登录网页端客服获移动端小程序 客服接收发送客服消息
10.框架接口-getApp()
通过getApp() 方法获取到小程序全局唯一的App实例
所以在getApp()中添加全局共享的数据、方法从而实现页面、组件的数据传值注意事项
不要在App()方法中使用getApp(), 使用this就可以拿到app实例通过getApp()获取实例后不要私自调用生命周期函数// app.js
const appInstance getApp()
App({// 全局共享的数据globalData: {token: },// 全局共享的方法setToken(token) {this.globalData.token token}
})button bind:taplogin登录/button// pages/profile/profile.js
const appInstance getApp()
Page({login () {appInstance.setToken(ncjdcbhwerbcj)}})
