目录

页面配置

1. 页面配置文件的作用

2. 页面配置和全局配置的关系

3. 页面配置中常用的配置项

网络数据请求

1. 小程序中网络数据请求的限制

2. 配置 request 合法域名

3. 发起 GET 请求

4. 发起 POST 请求

5. 在页面刚加载时请求数据


页面配置

1. 页面配置文件的作用

小程序中,每个页面都有自己的 .json 配置文件,用来对 当前页面 的窗口外观、页面效果等进行配置。

2. 页面配置全局配置的关系

小程序中,app.json 中的 window 节点,可以全局配置小程序中每个页面的窗口表现
如果某些小程序页面想要拥有特殊的窗口表现,此时,“页面级别的 .json 配置文件”就可以实现这种需求。

 

注意:当页面配置与全局配置冲突时,根据就近原则,最终的效果以页面配置为准

 

3. 页面配置中常用的配置项

属性类型默认值描述
navigationBarBackgroundColorHexColor#000000当前页面导航栏背景颜色,如 #000000
navigationBarTextStyleStringwhite当前页面导航栏标题颜色,仅支持 black / white
navigationBarTitleTextString当前页面导航栏标题文字内容
backgroundColorHexColor#ffffff当前页面窗口的背景色
backgroundTextStyleStringdark当前页面下拉 loading 的样式,仅支持 dark / light
enablePullDownRefreshBooleanfalse是否为当前页面开启下拉刷新的效果
onReachBottomDistanceNumber50页面上拉触底事件触发时距页面底部距离,单位为 px

网络数据请求

1. 小程序中网络数据请求的限制

出于安全性方面的考虑,小程序官方对数据接口的请求做出了如下
两个限制:
① 只能请求 HTTPS 类型的接口
② 必须将接口的域名添加到信任列表

 

2. 配置 request 合法域名

需求描述:假设在自己的微信小程序中,希望请求 https://www.escook.cn/ 域名下的接口
配置步骤: 登录微信小程序管理后台 -> 开发 -> 开发设置 -> 服务器域名 -> 修改 request 合法域名

 

 

 

 

注意事项:
① 域名只支持 https 协议
② 域名不能使用 IP 地址或 localhost
③ 域名必须经过 ICP 备案
④ 服务器域名一个月内最多可申请 5 次修改

3. 发起 GET 请求

调用微信小程序提供的 wx.request() 方法,可以发起 GET 数据请求,示例代码如下:
get(){wx.request({url: 'https://www.escook.cn/api/get',method:'GET',data:{name:'热爱编程的小白白',age:21},success: (res)=> {console.log(res.data)}})},

 WXML:

效果:

 

4. 发起 POST 请求

调用微信小程序提供的 wx.request() 方法,可以发起 POST 数据请求,示例代码如下:

get(){wx.request({url: 'https://www.escook.cn/api/post',method:'POST',data:{name:'热爱编程的小白白',age:21},success: (res)=> {console.log(res.data)}})},

 

 

5. 在页面刚加载时请求数据

在很多情况下,我们需要在页面刚加载的时候自动请求一些初始化的数据。此时需要在页面的 onLoad 事件中调用获取数据的函数,示例代码如下: