uniapp监测网络uni.onNetworkStatusChange & uni.getNetworkType的使用区别

uniapp监测网络uni.onNetworkStatusChange & uni.getNetworkType的使用区别

阐述：

• 在实际项目开发中，难免会监测网络，下面来具体详解下小程序这两种监测网络的方法，各有什么不同以及如何配合使用。
• 这里配置的是 uniapp，微信小程序把 uni. 换成 wx. 即可。

uni.onNetworkStatusChange和 uni.getNetworkType的区别如下：

1、uni.onNetworkStatusChange：

• uni.onNetworkStatusChange 这个API，是在切换网络的时候执行，切换2G，3G，WiFi的时候会执行，一般都会放在 onShow里面，实时监听网络的切换。当小程序关闭后台的时候在 onHide 生命周期函数中 执行 “uni.offNetworkStatusChange()” 关闭监听网络。

小程序模拟器怎么进行切换网络呢？如下图：

2、uni.getNetworkType：

• uni.getNetworkType 这个API，在页面初始化的时候，或者是在方法执行的时候执行。比如你可以放在：onShow 跟 onl oad这样的生命周期里面来执行。

uni.getNetworkType && uni.onNetworkStatusChange 使用方式如下：

• 可根据自己的项目需求，进行自行配置调整即可。uni.getNetworkType && uni.onNetworkStatusChange 使用区别见上方。

		onShow(options) {
			// 切换网络的时候执行，而不是进入页面就执行。
			uni.onNetworkStatusChange(function (res) {
			    console.log("wdebug===res",res);
			    console.log(res.networkType);
			});
			uni.getNetworkType({
				success: function (res) {
					console.log("wdebug---res",res.networkType);
					if(res.networkType != 'wifi' && res.networkType != 'none') {
						uni.showToast({
							title: '正在使用流量播放',
							icon:'none',
							duration:3000
						})
					}else if(res.networkType == 'none') {
						console.log("wdebug--无网络测试");
						uni.showToast({
							title: '网络异常，请稍后再试',
							icon:'none',
							duration:3000
						})
					}
				}
			});
			// 切换网络，可指定关闭哪个网络监听
			let CALLBACK = function(res) {
			    // ...这里写你的业务逻辑
					console.log("wdebug====", res);
			}
			uni.offNetworkStatusChange(CALLBACK)
			uni.onNetworkStatusChange(CALLBACK);
		},