vue3.2开发微信小程序中某些内置API的写法

uniapp中使用vue3.2开发微信小程序时，会使用一些生命周期函数、分享好友、分享朋友圈等写法，下面聊一聊怎么去写

在Vue2开发小程序时data，methods与内置的API（生命周期函数、onPullDownRefresh、onReachBottom、onShareAppMessage、onShareTimeline等）都属于同级，分开去写，不需要引用

在vue3.2中，它们依旧是同级，但使用uniapp开发时都需要引用，而且这些API都从@dcloudio/uni-app中去引入，然后使用箭头函数的方式调用。

一、生命周期函数

onLoad 监听页面加载

onReady 监听页面初次渲染完成

onShow 监听页面显示

onHide 监听页面隐藏

onUnload 监听页面加载

onlaunch 监听小程序初始化

//以onLoad, onShow为例，其他也是这个写法
import { ref } from "vue"
import { onLoad, onShow } from '@dcloudio/uni-app'

const test = ref("123")

onLoad(() => {
	test.value = "456"
})

//引入其他页面传递过来的参数
// onLoad((options) => {
// 	    test.value = options.test
// })

onShow(() => {
	test.value = "789"
})

二、分享好友 

使用onShareAppMessage（）方法可以分享小程序某个页面给微信好友（小程序的右上角）

import { onShareAppMessage } from "@dcloudio/uni-app"

onShareAppMessage( () => {
	let imagePath = 'https://tidyimages.oss-cn-hangzhou.aliyuncs.com/wxactivity/2022112801.png'
	const promise = new Promise(resolve => {
		setTimeout(() => {
			resolve({
				title: '客户满意度调查问卷！',
				imageUrl: imagePath,
				path: '/pages/my/my',
			})
		}, 2000)
	})
	return {
		title: '客户满意度调查问卷！',
		path: '/pages/my/my',
		promise
	}
})

三、分享朋友圈

 使用onShareTimeline（）方法可以分享小程序某个页面到微信朋友圈（小程序的右上角）

import { onShareTimeline } from "@dcloudio/uni-app"

onShareTimeline( () => {
	let imagePath = 'https://tidyimages.oss-cn-hangzhou.aliyuncs.com/wxactivity/2022112801.png'
	let helpPhone = '151****2185'
	return{
		 title: '快来！冬衣/春秋衣/夏衣/鞋类统统9.9元任意洗',
		 query: 'helpPhone=' + helpPhone,
		 imageUrl: imagePath
	}
})

四、下拉刷新和上拉触底

使用onPullDownRefresh（）方法可以监听用户下拉刷新事件

使用onReachBottom（）方法可以监听用户上拉触底事件

import { onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app'

onPullDownRefresh(() => {
	uni.showNavigationBarLoading()
	getOrderList()
	getAccount()
	setTimeout(() => {
		uni.hideNavigationBarLoading()
		uni.stopPullDownRefresh()
	}, 400)
	console.log('结束下拉刷新')
})

onReachBottom(() => {
	getOrderList()
})