原生小程序

127 阅读2分钟

1.小程序API的三大分类:

事件监听API:用来监听某些事件的触发。

举例:wx.onWindowResize(function callback)监听窗口尺寸变化的事件。

同步API:以Sync结尾的API都是同步API

执行结果,可以通过函数返回值直接获取,如果执行出错会抛出异常。

举例:wx.setStorageSync('key','value')向本地存储中写入内容。

异步API:类似于jquery中的$.ajax(options)函数,需要通过sucess、fail、complete接收调用的结果。

举例:wx.request()发起网络请求,通过success回调函数接收数据。

2.rpx(responsive pixeel):是微信小程序独有的,用来解决屏适配的尺寸单位。

实现原理:鉴于不同设备屏幕的大小不同,为了实现屏幕的自动适配,rpx把所有设备屏幕,在宽度上等分为750份(即:当前屏幕的总宽度为750rpx)。 小设备,像素大一点,大的设备,像素小一点。

小程序在不同设备上运行的时候,会自动把rpx的样式单位换算成对应的像素单位来渲染,从而实现屏幕适配。

ad8684a4a3e213e07839c8b1a764899.jpg

3.小程序全局配置:

app.json文件是小程序的全局配置文件。

常用的配置项如下:

pages:记录当前小程序所有页面的存放路径

window:全局设置小程序窗口的外观

tabBar:设置小程序底部的tabBar效果

style:是否启用新版的组件样式

window节点常用的配置项:

bcc2038a30a736ee5cd395aa550eb64.jpg

navigationBar导航栏区域和背景区域在window配置, 下拉刷新也是在window配置,下拉刷新设置背景颜色:backgroundColor:十六进制;设置颜色;backgroundTextStyle:dark/light设置下拉刷新时loading样式。

下拉刷新不会自动消失,需要手动设置wx.stopPullDownRefresh()可以停止刷新。 监听下拉刷新事件是onPullDownRefresh。

上拉触底:就是上拉到某一部分距离,开始加载数据,默认是触底距离50px,通过onReachBottom属性配置这个也是在window或者页面json配置。

4.小程序的页面配置

e7f8e0804ed3e21fb3da046b89c3d28.jpg

5.tabBar:实现多页面的快速切换,可以是底部和顶部。最少2个、最多5个tab页签,当渲染顶部tabBar时,不显示icon,只显示文本。

4d305c609c13cc5bc1949f3aad07ecc.jpg

a4a081c65a317ffb1620aa5a033b14f.jpg

在tabBar中在list数组对象去配置的选项如下:

33616ced814559098cc1dac1fbee29d.jpg

6.小程序中涉及到事件对象的属性列表

1664424188036.jpg

7.target和currentTarget的区别

1664424374256.jpg