vue-router跳转方式的区别解析

 <router-link :to="{ name: 'word' }">路由name方式跳转首页</router-link>
      <router-link :to="{ path: '/word' }">路由path方式跳转首页</router-link>

<router-link :to="{ name: 'home', params: { key: '1', value: '跳转' } }">路由name,params方式跳转首页</router-link>
     <router-link :to="{ name: 'home', query: { key: '1', value: '跳转' } }">路由name,query方式跳转首页</router-link>
     
     <router-link :to="{ path: '/home', params: { key: '1', value: '跳转' } }">路由path,params方式跳转首页</router-link>
     <router-link :to="{ path: '/home', query: { key: '1', value: '跳转' } }">路由path,query方式跳转首页</router-link>

this.$router.push({ path: '/home'});
this.$router.push({ name: 'home'});

 <a-button type="primary" @click="goTo">路由name方式跳转</a-button>
  goTo() {
    this.$router.push({ name: 'home', params: { a: '1', b: '2' } });//推荐用params传参方式
    this.$router.push({ name: 'home', query: { a: '1', b: '2' } });
  }

goTo() {
    let routeData = this.$router.resolve({
      path: '/home',
    });
    window.open(routeData.href, '_blank');
  }

goTo() {
    let routeData = this.$router.resolve({
      name: 'home',
    });
    window.open(routeData.href, '_blank');
  }