nguyenvanduocit / vue-loading-spinner

Just another collection of loading spinners with Vue.js, alot of spinners
https://nguyenvanduocit.github.io/vue-loading-spinner/
687 stars 106 forks source link

Can't show spinner while main component is loading #28

Closed evan4 closed 1 year ago

evan4 commented 5 years ago

I want add preloader on main page. i add spinner and want to see while main component is loading on the page. But spiner doesn't appers. It's appears only if I add steTimeOut in mounted() How can I check if component is loading completly ? Here is my code toolbar.vue

<v-toolbar 
         v-show="!loading"
        clipped-left class="top-menu" style="z-index: 10">... </v-toolbar>
   <div 
        style="position: absolute; z-index: 4; margin: 0 auto; top: 64px; width: 100%">
            <main_search 
            @loaded="loaded"
           v-show="!loading"
             v-if="main_search"></main_search>
            <card v-if="show_card" :change="get_change_card"></card>
        </div>
        <rotate-square2 
        style="position: fixed; top: 50%; left: 50%; width: 80px; height: 80px;"
        v-if="loading"></rotate-square2>
</template>

<script>
 import {RotateSquare2} from 'vue-loading-spinner';

    export default {
        props: [],
        components: {
            main_search,
            card,
            RotateSquare2
        },
        data: () => ({
            loading: true,

And another component search.vue

mounted() {
 this.$emit('loaded');
    },