全局配置
全局配置文件即常用的配置项
小程序根目录下的 .json
文件是小程序的全局配置文件。它记录了当前小程序中所有页面的存放路径,并全局设置小程序窗口的外观。此外,还可以设置小程序底部的效果,以及是否启用新版的组件样式。
小程序窗口的组成部分
小程序窗口主要由导航栏、页面内容区域和底部标签栏组成。导航栏用于显示标题和返回按钮,页面内容区域展示具体内容,底部标签栏则用于快速切换不同页面。
节点常用的配置
- 设置导航栏的标题:通过
navigationBarTitleText
属性设置。 - 设置导航栏的背景色:使用
navigationBarBackgroundColor
属性。 - 设置导航栏的标题颜色:通过
navigationBarTextStyle
属性设置(可选值只有black
和white
)。 - 全局开启下拉刷新功能:将
enablePullDownRefresh
的值设为true
。 - 设置下拉刷新时窗口的背景颜色:使用
backgroundColor
属性(颜色只能是16进制)。 - 设置下拉刷新时的样式:通过
backgroundTextStyle
属性设置(可选值只有dark
和light
)。 - 设置上拉触底的距离:使用
onReachBottomDistance
属性设置新数值(默认距离是50,设置时不写单位只写数字,没有特殊需求就不改)。
什么是 TabBar
TabBar 是端应用常见的页面效果
TabBar 用于实现多页面的快速切换,通常位于底部或顶部。在小程序中,TabBar 只能配置最少2个,最多5个页签。当渲染顶部时,不显示图标,只显示文本。
TabBar 的6个组成部分
TabBar 主要由图标、文本、选中状态、未选中状态、背景色和边框组成。每个部分都可以通过配置文件进行自定义。
节点配置项
在 app.json
文件中,可以通过 tabBar
节点配置 TabBar 的各项属性。每个项的配置选项包括图标路径、文本内容、选中状态的颜色等。
每个项的配置选项
在 tabBar
中的 list
属性里,首页配置一定要放置在第一项。这是非常重要的,因为首页通常是用户进入小程序后首先看到的页面。
页面配置
页面配置和全局配置的关系
app.json
中的 window
节点,可以全局配置小程序的每个页面的窗口表现。如果某些小程序的页面想要拥有特殊的窗口表现,可以通过“页面级别的 .json
配置文件”来实现。当页面配置与全局配置冲突时,根据就近原则,最终的效果以页面配置为准。
页面配置项中常用的配置项
常用的页面配置项包括 navigationBarTitleText
、navigationBarBackgroundColor
、navigationBarTextStyle
、enablePullDownRefresh
等。这些配置项可以根据具体页面的需求进行个性化设置。
网络数据请求
请求限制
在小程序中,网络数据请求有一些限制:
- 只能请求
HTTPS
类型的接口。 - 必须将接口的域名添加到信任列表。
配置合法域名
假设在自己的微信小程序中,希望请求 https://example.com
域名下的接口,配置步骤如下:
- 登录微信小程序管理后台。
- 进入设置 -> 服务器域名 -> 修改合法域名。
注意:
- 域名只支持
HTTPS
协议。 - 域名不能使用
IP
地址或localhost
。 - 域名必须经过备案。
- 服务器域名一个月内最多可申请5次修改。
发起请求
调用微信小程序提供的 wx.request()
方法,可以发起数据请求。这个方法支持 GET
、POST
等多种请求方式,并且可以设置请求头、请求参数等。
在页面刚加载时请求数据
很多情况下,我们需要在页面刚加载的时候,自动请求一些初始化的数据。此时需要在页面的 onLoad
事件中调用获取数据的函数。
跳过合法域名校验
如果后端仅仅提供了 HTTP
协议的接口,暂时没有提供 HTTPS
协议的接口。此时为了不耽误进度,可以在微信者工具中,临时开启“环境不校验请求域名,TLS 版本及证书”选项,跳过合法域名校验。
注意:跳过合法域名校验的选项,仅限在与调试阶段使用。
关于跨域和 Ajax 的说明
跨域问题只存在于基于浏览器的 Web 应用中。由于小程序的宿主环境不是浏览器,所以小程序不存在跨域问题。Ajax 技术的核心是依赖于浏览器的 XMLHttpRequest
对象,由于小程序的宿主环境是微信客户端,所以小程序中不能叫做“发起 Ajax 请求”,而是叫做“发起网络数据请求”。