mpvue 开发小程序蹲坑指南

mpvue:https://github.com/F-loat/mpvue-quickstart

mpvue-entry插件:https://github.com/F-loat/mpvue-entry (集中式页面配置,自动生成各页面的入口文件,优化目录结构,支持新增页面热更新)

mpvue-router-patch路由插件:https://github.com/F-loat/mpvue-router-patch

一,单独为每个页面的设置页面头部信息

 

带" ^ "表示首页,需要在你的main.js文件中export default { config: {} },这才能被我们的 loader 识别为这是一个配置,需要写成 json 文件。(这是早起配置,可查看mpvue-loader升级指南)

二,所有页面里的created生命周期函数  都会在小程序加载的时候一次性全部执行,而不是每进入一个页面执行一次,如:

有三个页面:

pageA

...省略一些代码...
created(){
    console.log('pageA 的 created函数执行')
}

pageB

...省略一些代码...
created(){
    console.log('pageB 的 created函数执行')
}

pageC

...省略一些代码...
created(){
    console.log('pageC 的 created函数执行')
}

然后,启动小程序,不进入这3个页面,假设我现在有一个index页面,我们打开这个页面,会输出:

pageA 的 created函数执行
pageB 的 created函数执行
pageC 的 created函数执行

解决的话用mounted或者onLoad或者onReady代替,created和mounted是vue(mpvue)的生命周期,而onLoad、onReady是小程序的生命周期,mpvue官方给的说明是:

除了 Vue 本身的生命周期外,mpvue 还兼容了小程序生命周期,这部分生命周期钩子的来源于微信小程序的
Page, 除特殊情况外,不建议使用小程序的生命周期钩子。

但是官方给的生命周期图示里面,也表明了,小程序的onLoad、onReady比mounted执行的早,减少页面白屏时间,个人倾向于使用小程序生命周期

三,请勿在 scroll-view 中使用 textarea、map、canvas、video 组件

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值