vue-online-prop -我在线吗？一个很小的 ​​VueJS 插件（<1kb）。

我只想要一件事，而且只想要一件事。

我只是希望所有 Vue 组件中都有一个反应属性$online来告诉我用户是否已连接到互联网。

我知道我知道，已经有很多现有的vue-online包，但是......不用了，我不需要捆绑的额外 UI 组件......

所以我制作了vue-online-prop（npm，github）

设置：

import VueOnlineProp from "vue-online-prop"
Vue.use(VueOnlineProp)

用法：

<div v-if="!$online"> 
    You are currently offline!
</div>

塔达。

就这样！

（附加内容）它的制作方法

如何使用 Javascript 检查我是否在线

您可以使用 通过 Javascript 查询互联网连接，并使用窗口上的和事件navigator.onLine监听连接的变化。onlineoffline

👉 MDN 文档navigator.onLine

创建 VueJS 插件

此插件只需监听窗口上的online和事件，并将 的值设置为由插件管理的反应式属性。使用 安装插件时，它会添加一个mixin，用于将反应式属性绑定到每个组件中的 属性。（👉代码如下）offlinenavigator.onLinestatusVue.use(VueOnlineProp)beforeCreatestatus$online