uni.onNetworkStatusChange(listener)

监听网络状态变化

onNetworkStatusChange 兼容性

Web	微信小程序	Android	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.81	4.81	4.81	4.61

参数

名称	类型	必填	默认值	兼容性	描述
listener	(result: OnNetworkStatusChangeCallbackResult) => void	是	-	- Web 微信小程序 Android iOS HarmonyOS - - - - -

OnNetworkStatusChangeCallbackResult 的属性值

名称	类型	必备	默认值	兼容性	描述
isConnected	boolean	是	-	Web 微信小程序 Android Android uni-app x UTS 插件 iOS iOS uni-app x UTS 插件 HarmonyOS 4.0 4.41 4.81 4.81 4.81 4.81 4.61	当前是否有网络连接
networkType	string	是	-	Web 微信小程序 Android Android uni-app x UTS 插件 iOS iOS uni-app x UTS 插件 HarmonyOS 4.0 4.41 4.81 4.81 4.81 4.81 4.61	网络类型(wifi、2g、3g、4g、5g、unknown、none)

返回值

类型
number

参见

• 相关 Bug
• 参见uni-app相关文档
• 微信小程序文档
• 支付宝小程序文档
• 百度小程序文档
• 抖音小程序文档
• 飞书小程序文档
• 钉钉小程序文档
• QQ小程序文档
• 快手小程序文档
• 京东小程序文档
• 华为快应用文档
• 360小程序文档

uni.offNetworkStatusChange(listener?)

取消监听网络状态变化

offNetworkStatusChange 兼容性

Web	微信小程序	Android	iOS	iOS uni-app x UTS 插件	HarmonyOS
4.0	4.41	4.81	4.81	4.81	4.61

参数

名称	类型	必填	默认值	兼容性	描述
listener	number | (result: OnNetworkStatusChangeCallbackResult) => void	否	-	- Web 微信小程序 Android iOS HarmonyOS - - - - -

OnNetworkStatusChangeCallbackResult 的属性值

名称	类型	必备	默认值	兼容性	描述
isConnected	boolean	是	-	Web 微信小程序 Android Android uni-app x UTS 插件 iOS iOS uni-app x UTS 插件 HarmonyOS 4.0 4.41 4.81 4.81 4.81 4.81 4.61	当前是否有网络连接
networkType	string	是	-	Web 微信小程序 Android Android uni-app x UTS 插件 iOS iOS uni-app x UTS 插件 HarmonyOS 4.0 4.41 4.81 4.81 4.81 4.81 4.61	网络类型(wifi、2g、3g、4g、5g、unknown、none)

参见

• 相关 Bug
• 参见uni-app相关文档
• 微信小程序文档
• 支付宝小程序文档
• 百度小程序文档
• 抖音小程序文档
• 飞书小程序文档
• 钉钉小程序文档
• QQ小程序文档
• 快手小程序文档
• 京东小程序文档
• 华为快应用文档
• 360小程序文档

示例

示例为hello uni-app x alpha分支，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例另见

扫码体验（手机浏览器跳转到App直达页）

扫码体验

示例

<template>
  <page-head title="networkStatusChange"></page-head>
  <view class="uni-list-cell-padding status-box">
    <text class="uni-title-text">网络状态</text>
    <view class="uni-row uni-common-mt">
      <text class="uni-hello-text">是否连接：</text>
      <text>{{ isConnected ? '已连接' : '未连接' }}</text>
    </view>
    <view class="uni-row uni-common-mt">
      <text class="uni-hello-text">网络类型：</text>
      <text>{{ networkType }}</text>
    </view>
    <view class="uni-row uni-common-mt">
      <text class="uni-hello-text">监听状态：</text>
      <text>{{ listenStatus }}</text>
    </view>
  </view>
  <view class="uni-list-cell-padding uni-common-mt">
    <button type="primary" @click="startListen">开始监听</button>
    <button type="default" class="uni-common-mt" @click="stopListen">停止监听</button>
  </view>
</template>

<script lang="uts" setup>
  const isConnected = ref(false)
  const networkType = ref('unknown')
  const listenStatus = ref('未监听')
  const networkCallback = ref<((result : OnNetworkStatusChangeCallbackResult) => void) | null>(null)
  // 获取当前网络状态
  const getCurrentNetworkStatus = () => {
    uni.getNetworkType({
      success: (res) => {
        networkType.value = res.networkType
        isConnected.value = res.networkType != 'none'
      },
      fail: () => {
        console.log('获取网络状态失败')
        networkType.value = 'unknown'
        isConnected.value = false
      }
    })
  }
  // 开始监听
  const startListen = () => {
    if (networkCallback.value != null) {
      listenStatus.value = '正在监听'
      return
    }
    networkCallback.value = (result : OnNetworkStatusChangeCallbackResult) => {
      console.log('网络状态: ', result);
      isConnected.value = result.isConnected
      networkType.value = result.networkType
      if (!result.isConnected) {
        networkType.value = 'none'
      }
    }
    uni.onNetworkStatusChange(networkCallback.value)
    // console.log('开始监听网络状态')
    listenStatus.value = '正在监听'
  }
  // 停止监听
  const stopListen = () => {
    if (networkCallback.value == null) {
      listenStatus.value = '未监听'
      return
    }
    uni.offNetworkStatusChange(networkCallback.value)
    networkCallback.value = null
    // console.log('停止监听网络状态')
    listenStatus.value = '停止监听'
  }

  onLoad(() => {
    getCurrentNetworkStatus()
  })
  onUnload(() => {
    stopListen()
  })
</script>

<style>
  .status-box {
    background-color: #FFFFFF;
    margin: 0 20px;
  }
</style>

示例源码如下，请查看 pre > code 标签中的内容

<template>
  <page-head title="networkStatusChange"></page-head>
  <view class="uni-list-cell-padding status-box">
    <text class="uni-title-text">网络状态</text>
    <view class="uni-row uni-common-mt">
      <text class="uni-hello-text">是否连接：</text>
      <text>{{ isConnected ? '已连接' : '未连接' }}</text>
    </view>
    <view class="uni-row uni-common-mt">
      <text class="uni-hello-text">网络类型：</text>
      <text>{{ networkType }}</text>
    </view>
    <view class="uni-row uni-common-mt">
      <text class="uni-hello-text">监听状态：</text>
      <text>{{ listenStatus }}</text>
    </view>
  </view>
  <view class="uni-list-cell-padding uni-common-mt">
    <button type="primary" @click="startListen">开始监听</button>
    <button type="default" class="uni-common-mt" @click="stopListen">停止监听</button>
  </view>
</template>

<script lang="uts" setup>
  const isConnected = ref(false)
  const networkType = ref('unknown')
  const listenStatus = ref('未监听')
  const networkCallback = ref<((result : OnNetworkStatusChangeCallbackResult) => void) | null>(null)
  // 获取当前网络状态
  const getCurrentNetworkStatus = () => {
    uni.getNetworkType({
      success: (res) => {
        networkType.value = res.networkType
        isConnected.value = res.networkType != 'none'
      },
      fail: () => {
        console.log('获取网络状态失败')
        networkType.value = 'unknown'
        isConnected.value = false
      }
    })
  }
  // 开始监听
  const startListen = () => {
    if (networkCallback.value != null) {
      listenStatus.value = '正在监听'
      return
    }
    networkCallback.value = (result : OnNetworkStatusChangeCallbackResult) => {
      console.log('网络状态: ', result);
      isConnected.value = result.isConnected
      networkType.value = result.networkType
      if (!result.isConnected) {
        networkType.value = 'none'
      }
    }
    uni.onNetworkStatusChange(networkCallback.value)
    // console.log('开始监听网络状态')
    listenStatus.value = '正在监听'
  }
  // 停止监听
  const stopListen = () => {
    if (networkCallback.value == null) {
      listenStatus.value = '未监听'
      return
    }
    uni.offNetworkStatusChange(networkCallback.value)
    networkCallback.value = null
    // console.log('停止监听网络状态')
    listenStatus.value = '停止监听'
  }

  onLoad(() => {
    getCurrentNetworkStatus()
  })
  onUnload(() => {
    stopListen()
  })
</script>

<style>
  .status-box {
    background-color: #FFFFFF;
    margin: 0 20px;
  }
</style>

通用类型

GeneralCallbackResult

名称	类型	必备	默认值	兼容性	描述
errMsg	string	是	-	Web 微信小程序 Android iOS HarmonyOS - 4.41 - - -	错误信息