小程序常用API

1. 获取屏幕大小---uni.getSystemInfo()

uni.getSystemInfo

uni.getSystemInfo({
		success: (res) => {
		// *****高度宽度的单位都是px 
		console.log("1", res.screenHeight); // 屏幕高度，包含导航栏
		console.log("11", res.windowHeight); // 能够使用的窗口高度，不包含导航栏
		console.log("111", res.screenWidth); // 屏幕宽度
		console.log("1111", res.windowWidth); //  能够使用的窗口宽度

		// 能够使用的窗口高度，将px转换rpx
		this.windowHeight = (res.windowHeight * (750 / res.windowWidth))
		console.log(this.windowHeight)
	}
})

2. 获取元素距离顶部的高度

uni.createSelectorQuery()

返回一个 SelectorQuery 对象实例。可以在这个实例上使用 select 等方法选择节点，并使用 boundingClientRect 等方法选择需要查询的信息。

注意点：

• 使用 uni.createSelectorQuery() 需要在生命周期 mounted 后进行调用。
• 默认需要使用到 selectorQuery.in 方法。

const query = uni.createSelectorQuery().in(this);
	query.select('.wrap_top').boundingClientRect(data => {
	if (data) {
		// data.top就是元素距离顶部的高度
	    this.toop = data.top;
	    console.log('元素距离顶部的高度:', data.top);
	}
}).exec();

3. 页面跳转---uni.navigateTo

uni.navigateTo(OBJECT)

保留当前页面，跳转到应用内的某个页面

//在起始页面跳转到test.vue页面并传递参数
uni.navigateTo({
	url: '/pages/test?id=1&name=uniapp'
});


// 在test.vue页面接受参数
export default {
	onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
		console.log(option.id); //打印出上个页面传递的参数。
		console.log(option.name); //打印出上个页面传递的参数。
	}
}

 4. 本地存储

1. 异步存储获取

uni.setStorage            和     uni.getStorage

2. 同步存储获取

uni.setStorageSync    和     uni.getStorageSync

同步vs异步	回调函数	适用场景
1.uni.setStorageSync 和 uni.getStorageSync 是同步方法，会阻塞后续代码的执行，直到操作完成 2.uni.setStorage 和 uni.getStorage 是异步方法，不会阻塞后续代码的执行，而是通过回调函数来处理操作结果	uni.setStorage 和 uni.getStorage 可以提供成功、失败和完成时的回调函数，而同步方法不支持回调函数	1.同步方法适用于简单的数据存取，不涉及复杂的异步处理 2.异步方法适用于需要在数据存取完成后执行额外逻辑或需要处理大量数据时

//同步
uni.setStorageSync("index_HotRecommend", data)//存储
var HotRecommend = uni.getStorageSync("index_HotRecommend"); // 获取

//异步
uni.getStorage({
	key: 'storage_key',
	success: function (res) {
		console.log(res.data);
	}
});
uni.setStorage({
	key: 'storage_key',
	data: 'hello',
	success: function () {
		console.log('success');
	}
});

5. 消息提示框---uni.showModal() 

uni.showModal

uni.showModal({
	title: '提示',
	content: '这是一个模态弹窗',
	success: function (res) {
		if (res.confirm) {
			console.log('用户点击确定');
		} else if (res.cancel) {
			console.log('用户点击取消');
		}
	}
});

6. 监听键盘高度变化---uni.onKeyboardHeightChange()

uni.onKeyboardHeightChange

uni.onKeyboardHeightChange(res => {
	this.height_keyboard = parseFloat(res.height)
	console.log("键盘高度是", this.height_keyboard)
})