vm.$set的使用

当我们写组件的路由时，我们知道在beforeRouterEnter这个路由钩子里（指的是当我们进入路由前），通常在这个钩子里面进行数据请求（准备阶段），这个时候我们是获取不到这个this的（在组件内this指代的就是这个组件），但是有时候我们需要通过this进行设置

解决方案：

 beforeRouteEnter ( to,from,next ) {
    // console.log('beforeRouteEnter')
    // console.log( this ) this这个时候是没有的

    fetch('/data.json')
      .then( res => res.json())
      .then( data => {
        // this.msg =  data     ? 但是有一个问题，this访问不到，也就是说组件没有
        next( vm => { //vm就是当前组件
          console.log( vm )
          // 我们想直接给vm加一个数据就可以了，vm.data = data ?这个可以吗？不可以的
          // 理由： 组件通过data选项来设置getter和setter,但是必须是在组件选项中书写 ，
  

          // 解决： 如果我们可以将请求到的数据合并到  组件  data选项中是不是就可以了 
          Object.assign, Vue.set    this.$set   object.asingn是Vue.set的底层封装，
          我们通常使用Vue.set ，this.$set  ，即，我们可以通过vm.$set去设置


          // vm.$set( data选项中的一个数据,自定义属性, 想要合并上去的数据  )
          vm.$set( vm.data,'data1', data )

        })
      })
      .catch( error => console.log( error ))

    // next()
  },