如何使用SVG添加预加载动画vue.js温泉的应用

Question

我需要添加一个预加载动画vue.js SPA应用程序在后台同时加载文件时，使用SVG和一个进度条。因此，而不是用户看到空白屏幕，他可以看到一个动画。如Gmail加载动画或https://jsfiddle.net/东西感谢您的任何意见

Answer 1

VueJS有生命周期。对于最重要的是：beforeCreate, created, beforeMount, mounted。 所以，在你的组件中，data下面，你可以写在这些生命周期的一些逻辑。因此，例如在beforeCreate或created钩可以显示你的SVG装载机，然后在mounted（插入DOM），您将其隐藏。

例如：

 //MyComponent.vue
      <template>
         ...
      </template

    <script>
      export default {
        data() {
            return {
            article : {},
            user_id: null
        },
        created() {
         //Display your SVG
        },
        mounted() {
        //Hide your SVG
        },
        methods: {
        //etc,etc
        }
    </script>