mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-17 14:56:44 +08:00
fix(lan): 修复局域网服务检测逻辑与显示控制
- 将 `v-if` 替换为 `v-show` 以避免组件重复创建 - 使用 `.sync` 修饰符替代 `value` 事件进行双向绑定 - 调整检测超时逻辑,超时后设置为检测成功 - 网络响应失败时正确同步状态值 - 移除模板中冗余的条件渲染包装元素
This commit is contained in:
@@ -20,7 +20,7 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
syncValue(val) {
|
syncValue(val) {
|
||||||
this.loading = false
|
this.loading = false
|
||||||
this.$emit('value', val)
|
this.$emit('update:value', val)
|
||||||
},
|
},
|
||||||
/**局域网检测*/
|
/**局域网检测*/
|
||||||
lanServiceCheck() {
|
lanServiceCheck() {
|
||||||
@@ -30,7 +30,7 @@ export default {
|
|||||||
const controller = new AbortController();
|
const controller = new AbortController();
|
||||||
const timeoutId = setTimeout(() => {
|
const timeoutId = setTimeout(() => {
|
||||||
controller.abort();
|
controller.abort();
|
||||||
this.syncValue(false);
|
this.syncValue(true);
|
||||||
}, 1000);
|
}, 1000);
|
||||||
|
|
||||||
// 拼接随机参数(时间戳+随机数,确保URL唯一,防止缓存)
|
// 拼接随机参数(时间戳+随机数,确保URL唯一,防止缓存)
|
||||||
@@ -43,7 +43,7 @@ export default {
|
|||||||
})
|
})
|
||||||
.then(response => {
|
.then(response => {
|
||||||
clearTimeout(timeoutId);
|
clearTimeout(timeoutId);
|
||||||
response.ok ? this.syncValue(true) : this.syncValue(false);
|
this.syncValue(!response.ok)
|
||||||
})
|
})
|
||||||
.catch(error => {
|
.catch(error => {
|
||||||
clearTimeout(timeoutId);
|
clearTimeout(timeoutId);
|
||||||
@@ -58,7 +58,6 @@ export default {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="lan-checker-container">
|
<div class="lan-checker-container">
|
||||||
<div v-if="value">
|
|
||||||
<div>
|
<div>
|
||||||
<span>{{ errorMsg }}</span>
|
<span>{{ errorMsg }}</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -66,7 +65,6 @@ export default {
|
|||||||
<el-button v-loading="loading" type="primary">重新检测</el-button>
|
<el-button v-loading="loading" type="primary">重新检测</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -37,11 +37,11 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content-wrapper" v-if="isLan">
|
<div class="content-wrapper" v-show="isLan">
|
||||||
<lan-service-checker v-model="isLan"/>
|
<lan-service-checker :value.sync="isLan"/>
|
||||||
</div>
|
</div>
|
||||||
<!-- 内容区域 -->
|
<!-- 内容区域 -->
|
||||||
<div class="content-wrapper" v-else >
|
<div class="content-wrapper" v-show="!isLan" >
|
||||||
<div
|
<div
|
||||||
class="welcome-message"
|
class="welcome-message"
|
||||||
ref="messageContainer"
|
ref="messageContainer"
|
||||||
|
|||||||
Reference in New Issue
Block a user