逆战-微信小程序

1 微信小程序基本知识与概念
a.目录结构和app.json
小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。
一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下:
在这里插入图片描述
一个小程序页面由四个文件组成,分别是:
在这里插入图片描述
注意:为了方便开发者减少配置项,描述页面的四个文件必须具有相同的路径与文件名。
全局配置文件app.json
1.对于一个小程序项目而言,最重要的文件是app.json,它也是开发工具识别一个文件夹是否为小程序项目的标识。当使用开发者工具创建一个项目是,如果选择的是空文件夹,它会创建一个新的项目。如果是一个有文件的文件夹,它会看该文件夹中是否有app.jon文件,如果有,则它会认为是一个小程序项目,则会打开该项目,如果文件夹中没有app.json文件,则提示无法创建项目。
2.app.json必须放置于项目的根目录下,它是小程序项目的全局配置文件。在小程序代码包准备完成进行启动后(下文会详细介绍小程序从用户点击打开小程序到小程序销毁的整个过程),会先读取app.json文件,进行小程序的初试化,比如初始化整个小程序外框样式,获取首页页面地址等。
!其实小程序就是微信提供的一个容器,各个页面就在这个容器里加载运行销毁 b.小程序的全局配置选项
pages
在app.json中,pages选项是必须配置的。该配置项注册了小程序所有页面的地址,其中每一项都是页面的 路径+文件名 。配置的字符串其实就是每个页面wxml路径,去掉.wxml后缀。因为框架会自动去寻找路径下.json、.js、.wxml、.wxss四个文件进行整合。也就意味着.json、.js、.wxss这三个文件的文件名必须要和.wxml的一致,否则不生效。所以一个页面至少必须得有.wxml文件。
!页面的.json、.js、.wxss文件必须与.wxml文件同名,否则不生效
每个页面都必须pages下注册,没有注册的页面,如果不访问,编译能通过,一旦试图访问该页面则会报错
可以通过在pages下添加一个选项快速新建一个页面,开发工具会自动生成对应的文件
window
该配置项用于配置小程序的全局外观样式,具体请查阅文档。
tabBar
该选项可以让我们轻松实现导航栏tab效果,不过有个不足就是跳转可操作性非常低。就是每个tab只能跳当前小程序页面,不同跳到其他小程序。如果需要跳到其他小程序,自己可封装个组件。
networkTimeout
这是网络请求超时时间,可以设置不同类型请求的超时时间,比如wx.request、wx.uploadFile等。小程序默认是60s超时,但我们应该手动设置更低的值,如果网络或者服务器出问题了,那么会让用户等60s,最后还是失败,这对用户很不友好,还不如提前告诉用户,现在出问题了,请稍后再试。
debug
是否开启debug功能,开启后查看更多的调试信息,方便定位问题,开发阶段可以考虑开启
plugins
小程序插件必须挂载在一个微信小程序中,一个小程序也只能开通一个插件。当你小程序开通的插件启用了插件功能也时,必须设置该选项为true
usingComponents
使用自定义组件或者插件提供的组件前,必须先在这里声明
2.小程序启动与生命周期
小程序启动会有两种情况,一种是「冷启动」,一种是「热启动」。 假如用户已经打开过某小程序,然后在一定时间内再次打开该小程序,此时无需重新启动,只需将后台态的小程序切换到前台,这个过程就是热启动;冷启动指的是用户首次打开或小程序被微信主动销毁后再次打开的情况,此时小程序需要重新加载启动。
组件生命周期
组件的生命周期,指的是组件自身的一些函数,这些函数在特殊的时间点或遇到一些特殊的框架事件时被自动触发。
其中,最重要的生命周期是 created attached detached ,包含一个组件实例生命流程的最主要时间点。
组件实例刚刚被创建好时, created 生命周期被触发。此时,组件数据 this.data 就是在 Component 构造器中定义的数据 data 。 此时还不能调用 setData 。 通常情况下,这个生命周期只应该用于给组件 this 添加一些自定义属性字段。
在组件完全初始化完毕、进入页面节点树后, attached 生命周期被触发。此时, this.data 已被初始化为组件的当前值。这个生命周期很有用,绝大多数初始化工作可以在这个时机进行。
在组件离开页面节点树后, detached 生命周期被触发。退出一个页面时,如果组件还在页面节点树中,则 detached 会被触发。
3.组件间通信与事件
组件间的基本通信方式有以下几种。
WXML 数据绑定:用于父组件向子组件的指定属性设置数据,仅能设置 JSON 兼容数据(自基础库版本 2.0.9 开始,还可以在数据中包含函数)。具体在 组件模板和样式 章节中介绍。
事件:用于子组件向父组件传递数据,可以传递任意数据。
如果以上两种方式不足以满足需要,父组件还可以通过 this.selectComponent 方法获取子组件实例对象,这样就可以直接访问组件的任意数据和方法。

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值