该组件无需任何配置，引入即可，内部自动处理所有功能和事件，有如下特点：
- 如果没有网络，该组件会以
fixed定位，并且以很大的z-index值覆盖原来的内容。一旦有网络了，会自动隐藏该组件，实现自动化 - 在APP上，嵌入了5+接口，可以直接打开手机的设置页面，方便用户进行网络相关的设置
说明
- 应用有网络时，是不会触发本组件的，为了测试此功能，请关闭手机的数据连接以及WiFi即可
- 由于普通的组件无法覆盖原生组件，所以本组件不适用那些有
video，map等原生表现的组件的页面，可以自行使用uni的cover-view组件修改
#平台差异说明
| App（vue） | App（nvue） | H5 | 小程序 |
| √ | √ | √ | √ |
#基本使用
<template> <view> <u-no-network @disconnected="disconnected" @connected="connected" @retry="retry" ></u-no-network> <view class="u-content"> <view class="u-content__circle"> <u-icon name="checkbox-mark" color="#fff" size="30" ></u-icon> </view> <text class="u-content__normal">网络正常</text> </view> </view> </template> <script> export default { methods: { disconnected() { console.log('disconnected'); }, connected() { console.log('connected'); }, retry() { console.log('retry'); } }, } </script> <style lang="scss" scoped> .u-content { padding: 150px 60px 0; @include flex(column); align-items: center; justify-content: center; &__circle { background-color: $u-success; @include flex; border-radius: 100px; width: 60px; height: 60px; align-items: center; justify-content: center; } &__normal { font-size: 15px; color: $u-success; margin-top: 15px; } } </style>
