Version: 0.0.10.0.20.0.30.0.40.0.50.0.70.0.90.0.100.0.112.0.172.1.02.1.12.1.22.1.32.1.42.1.52.1.62.1.72.1.92.1.112.1.122.1.132.1.142.2.02.2.12.2.22.2.32.2.42.2.52.2.62.2.72.2.82.2.92.2.102.2.112.2.122.2.132.2.142.2.152.2.172.2.182.2.202.2.212.2.222.2.232.2.242.2.262.2.272.2.282.2.292.2.302.2.312.2.322.2.332.2.342.2.352.2.362.2.372.2.382.2.392.2.402.2.412.2.422.2.442.2.452.2.462.2.472.3.02.3.12.3.22.3.32.3.42.3.62.3.72.3.82.3.92.3.102.3.112.3.122.3.132.3.142.3.152.3.162.3.172.3.182.3.192.3.202.3.212.3.222.3.232.3.242.3.252.3.262.3.272.3.282.3.312.4.02.4.13.0.03.0.23.0.33.0.53.0.63.0.73.0.83.1.03.2.03.2.13.2.23.2.33.2.43.2.53.2.63.2.73.2.84.0.04.0.14.0.24.0.34.0.44.0.54.0.64.0.74.0.84.0.94.0.104.0.114.0.124.0.134.0.144.0.154.0.164.0.174.0.184.0.194.0.204.0.214.0.224.0.235.0.05.0.15.0.25.0.35.0.45.0.55.0.65.0.75.0.85.0.95.1.05.1.15.1.55.1.65.2.05.2.15.2.25.2.35.2.45.2.65.2.75.2.85.2.95.2.11
<template>
<div class="overlay" v-show="visible" :style="{position: type}">
<div class="box">
<img width="20" src="../assets/images/loading2.gif">
</div>
</template>
<script>
export default {
data() {
return {
visible: false
};
},
props: {
show: {
default: false,
type: Boolean
// 至少显示多少毫秒
min: {
type: Number,
default: 100
type: {
type: String,
default: "fixed"
}
watch: {
show(val) {
if (val) {
this.visible = true;
} else {
if (this.min === 0) {
this.visible = false;
return;
setTimeout(() => {
}, this.min);
</script>
<style scoped>
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: white;
.box {
width: 20px;
height: 20px;
margin: auto;
position: absolute;
right: 0;
bottom: 0;
</style>