vue中检测断网处理
在app.vue中定义一个变量,来记录是否显示断网data() {return {network: true //默认有网};},// mounted中检测是否断网mounted() {// 检测断网window.addEventListener("offline", () => {console.log("...
·
在app.vue中定义一个变量,来记录是否显示断网
data() {
return {
network: true //默认有网
};
},
// mounted中检测是否断网
mounted() {
// 检测断网
window.addEventListener("offline", () => {
console.log("已断网");
this.network= false;
});
window.addEventListener("online", () => {
console.log("网络已连接");
this.network= true;
});
}
<!-- 断网显示图片替换内容 -->
<template>
<div id="app">
<!-- 断网显示的图片,使用转换工具转换成base64格式,才可以显示 -->
<img
class="nonet"
v-if="!network"
src="data:image/png;base64*******"
/>
<router-view v-else />
</div>
</template>
更多推荐
已为社区贡献15条内容
所有评论(0)