浏览器监听网络变化

window.addEventListener('load', () => {
      this.$message.success('界面加载完成!')
      // 在页面加载后，设置正确的网络状态
      if (navigator.onLine) {
        // 自己其他的业务代码
      }
      // 开始监听网络状态的变化
      window.addEventListener('online', () => {
        this.$message({
          type: 'success',
          message: '网络连接恢复!'
        })
        // 自己其他的业务代码
      })
      window.addEventListener('offline', () => {
        this.$message({
          type: 'success',
          duration: 10000,
          message: '网络连接断开, 请检查!'
        })
        // 自己其他的业务代码
      })
    })

正常来说 在PC浏览器上上面代码已经够用了, 可以正常监听, 但是在安卓 App 加载的  webview中还是不生效, 这个时候就需要在安卓底座上进行监听, 然后再传递给webview

    // uniApp 中
    onLoad() {
			// #ifdef APP-PLUS
			var that = this
			var webview = plus.webview.currentWebview(); //获取窗口
			uni.onNetworkStatusChange(function (res) {
				if(res.isConnected) {
					uni.showToast('网络已连接')
					webview.evalJS('netWorkChangeHandler(true)')
				} else {
					uni.showToast({
						title: "网络已断开",
						icon: 'error',
						duration: 5000,
					})
				}
			});
			// #endif
		},




// webview 中
    window.netWorkChangeHandler = (status) => {
      this.$message.error('网络状态发生改变', status)
      if (status) {
        this.$message({
          type: 'success',
          message: '网络连接恢复!'
        })
        // 自己其他的业务代码
      } else {
        this.$message({
          type: 'success',
          duration: 10000,
          message: '网络连接断开, 请检查!'
        })
      }
    }