vue 获取数据

<template>
  <div>
    <div v-if="loading"> Loading ... </div>
    type
  </div>
</template>

<script>
export default {
  name: 'Type',
  props: {
      msg: String
  },
  created(){
    this.fetchData();
  },
  watch: {
    '$route': 'fetchData'
  },
  data(){
    return {
      loading: false
    }
  },
  methods: {
      fetchData(){
         var self = this;
         this.loading = true;
         console.log("已经进入组件了");
        
         setTimeout(function(){
            self.loading = false;
         },300);
      }
  }
}

export default {
  data () {
    return {
      post: null,
      error: null
    }
  },
  beforeRouteEnter (to, from, next) {
    getPost(to.params.id, (err, post) => {
      next(vm => vm.setData(err, post))
    })
  },
  // 路由改变前，组件就已经渲染完了
  // 逻辑稍稍不同
  beforeRouteUpdate (to, from, next) {
    this.post = null
    getPost(to.params.id, (err, post) => {
      this.setData(err, post)
      next()
    })
  },
  methods: {
    setData (err, post) {
      if (err) {
        this.error = err.toString()
      } else {
        this.post = post
      }
    }
  }
}