NoNetwork — No Network

17:06

Description

A full-screen no-network notice. On mount it reads the initial network state via uni.getNetworkType and listens to uni.onNetworkStatusChange; it fills the screen automatically when the network drops and hides automatically when the connection returns. It ships with a built-in illustration and copy, and the App platform additionally provides a "Go to Settings" entry.

Compatibility

Platform	Support
App	✅ Supported (an extra "Check Network + Go to Settings" row is shown)
H5	✅ Supported
WeChat Mini Program	✅ Supported

Examples

Basic Usage

No configuration needed — just import it. It appears automatically when flight mode is on or the network is disconnected.

View source

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

API

Props

Property	Description	Type	Default	Version
tips	Tip text shown when there is no network; falls back to the built-in copy when empty	string	''	-
zIndex	Component z-index (not wired up in the current version; it always uses the global no-network layer $u.zIndex.noNetwork)	number | string	-	-
image	Custom illustration (not wired up in the current version; it always uses the built-in base64 image)	string	''	-

Events

Event	Description	Params	Version
retry	Emitted when the "Retry" button is tapped (regardless of whether the network is currently available)	-	-

Slots

ux-no-network has no slots.

Notes

1. On App (APP-PLUS) an extra "Check Network + Go to Settings" row is rendered; H5 / WeChat Mini Program only show the illustration, the copy, and the "Retry" button.
2. The image and z-index props are declared but not wired up in the current version: the illustration always uses the built-in base64 image (image.uts), and z-index always uses $u.zIndex.noNetwork, so passing them has no effect.
3. retry is emitted regardless of whether the network is currently available; internally the component shows a "No connection / Connected" toast based on the latest network state.
4. The uni.onNetworkStatusChange listener registered on mount is not removed on unmount, so watch out for stacked listeners when the component is frequently created/destroyed.
5. The root node is position: fixed and fills the screen while blocking touchmove, so the underlying page cannot scroll while it is visible.
6. retry() and openSettings() are exposed via ref, allowing you to trigger a retry or the settings entry manually.
7. On App, "Go to Settings" currently only shows a toast and does not actually navigate to the system settings page.