NoNetwork 无网络

17:06

说明

全屏无网络提示。挂载时通过 uni.getNetworkType 读取初始网络状态，并监听 uni.onNetworkStatusChange；断网自动铺满全屏显示，恢复联网自动隐藏。内置提示图与文案，App 端额外提供「去设置」入口。

兼容性

平台	支持情况
App	✅ 支持（额外显示「检查网络 + 去设置」一行）
H5	✅ 支持
微信小程序	✅ 支持

示例

基础用法

该组件无需任何配置，引入即可使用。开启飞行模式或断开网络后自动显示。

查看源码

<template>
    <ux-no-network></ux-no-network>
</template>

API

Props

属性	说明	类型	默认值	版本
tips	无网络时的提示文字，留空取内置文案	string	''	-
zIndex	组件层级 z-index（当前版本未接入，固定取全局无网络层级 $u.zIndex.noNetwork）	number | string	-	-
image	自定义提示图（当前版本未接入，固定使用内置 base64 图）	string	''	-

Events

事件名	说明	回调参数	版本
retry	点击「重试」按钮时触发（无论当前是否已联网）	-	-

Slots

ux-no-network 无插槽。

注意事项

1. App 端（APP-PLUS）会额外渲染「检查网络 + 去设置」一行；H5 / 微信小程序只有提示图、文案与「重试」按钮。
2. image 与 z-index 两个 prop 已声明但当前版本未接入：提示图固定使用内置 base64 图（image.uts），z-index 固定取 $u.zIndex.noNetwork，传入均不生效。
3. retry 无论当前是否已联网都会派发；组件内部会按最新网络状态弹出「无连接 / 已连接」的 toast 提示。
4. 挂载时注册的 uni.onNetworkStatusChange 在卸载时未移除，页面频繁创建/销毁该组件时需留意监听叠加。
5. 根节点为 position: fixed 铺满全屏并阻止 touchmove，显示期间下层页面不可滚动。
6. 通过 ref 暴露 retry() 与 openSettings()，可手动触发重试或设置入口。
7. App 端的「去设置」当前只弹 toast 提示，并未真正跳转系统设置页。