loading.vue

<style lang="less" scoped>
</style>
<template>
    <div style="height:100%;" v-loading="loading" loading-text="加载中..." loading-text-size="15"
        loading-type="1" :loading-size="160">
        <div>
            <Button @click="openLoading">打开loading</Button>
            <Button @click="fullLoading">全屏loading</Button>
        </div>
    </div>
</template>
<script type="text/javascript">
import { Vuex } from 'dai-vue';
export default {
    props: {},
    data() {
        return {
            loading: false
        };
    },
    components: {},
    methods: {
        openLoading() {
            this.loading = true;
            setTimeout(() => {
                this.loading = false;
            }, 3000);
        },
        fullLoading() {
            let load = this.$loading({ text: '载入中....', type: 1 });
            setTimeout(() => {
                // load.remove();
                this.$loading.remove();
            }, 3000);
        }
    },
    watch: {},
    created() {},
    mounted() {},
    //计算属性
    computed: {
        ...Vuex.mapGetters(['vx_userInfo'])
    },
    destroyed() {}
};
</script>