vue-router官網(wǎng)上面是這樣說的// 帶查詢參數(shù)，變成 /register?plan=privaterouter.push({ path: 'register', query: { plan: 'private' }})然后，我就這樣寫了：this.$router.push({path:'manage', query: {id: 'tasklist'}})1結(jié)果很明顯，失敗了。然后我就默默的再次看了一下官網(wǎng)，結(jié)果發(fā)現(xiàn)了這句話// 命名的路由router.push({ name: 'user', params: { userId: 123 }})// 帶查詢參數(shù)，變成 /register?plan=privaterouter.push({ path: 'register', params: { plan: 'private' }})注意：如果提供了 path，params 會被忽略，上述例子中的 query 并不屬于這種情況。取而代之的是下面例子的做法，你需要提供路由的 name 或手寫完整的帶有參數(shù)的 path：const userId = 123router.push({ name: 'user', params: { userId }}) // -> /user/123router.push({ path: `/user/${userId}` }) // -> /user/123// 這里的 params 不生效router.push({ path: '/user', params: { userId }}) // -> /user謹(jǐn)記啊，動態(tài)實(shí)現(xiàn)二級路由，需要先用變量保存二級路由名稱(let router = 'tasklist')，然后調(diào)用this.$router.push({path: `/user/${router}`}).

watch: {   '$route'(to) {    if (to.meta.path === '/page/buy-details') {     this.id = to.params.id;     this.state()    }   }  },

export default { watch: {  '$route'(to, from) {   this.detailsLeave(from);   this.detailsOpen(to);  } }, data() {  return {   pagePath: '',   pageId: 0,   pages: {}  } }, methods: {  /**   * 子頁面打開觸發(fā)   * @param route   */  detailsOpen(route) {   if (this.detailsPathGet(route.path) === this.pagePath) {    if (!this.pages[route.params.id]) {     this.$set(this.pages, route.params.id, {      id: route.params.id,      scrollTop: 0     })    }    //路由打開 跳轉(zhuǎn)滾動條    this.pageId = route.params.id;    this.$nextTick(()=>{     this.$parent.$el.firstChild.scrollTop = this.pages[route.params.id].scrollTop;    });   }  },  /**   * 路由切換觸發(fā)   * 判斷離開的路由是否是當(dāng)前頁面，如果是則記錄滾動條高度   * @param route   */  detailsLeave(route) {   if (this.detailsPathGet(route.path) === this.pagePath) {    if (this.pages[route.params.id]) {     //記錄滾動條高度 此處針對ea-admin后臺 不同的框架要記錄的滾動條el不同     this.pages[route.params.id].scrollTop = this.$parent.$el.firstChild.scrollTop ;    }   }  },  /**   * 子頁面關(guān)閉函數(shù)   * @param id   */  detailsClose(id) {   delete this.pages[id]  },  /**   * 取路由不含最后一項(xiàng)參數(shù)的地址   * @param path   * @returns {string}   */  detailsPathGet(path) {   const i = path.lastIndexOf('/');   return path.substr(0, i);  } }, mounted() {  //通過當(dāng)前路由地址創(chuàng)建頁面識別地址 注：只對path: '/user/:id' 有效 當(dāng) path: /user/:id/profile 失效  this.pagePath = this.detailsPathGet(this.$route.path);  //執(zhí)行第一次子頁面打開  this.detailsOpen(this.$route);  //監(jiān)聽標(biāo)簽關(guān)閉消息 此處針對ea-admin后臺 不同框架監(jiān)聽關(guān)閉方式不同  this.$tabs.onRemove((page, next) => {   //收到標(biāo)簽關(guān)閉回調(diào)，判斷關(guān)閉的是否是當(dāng)前頁面   if (page._path === this.pagePath) {    //觸發(fā)子頁面刪除    this.detailsClose(page.id)   }   next()  }) }}

<template> <div>  <your-component    v-for="item in pages"    :id="item.id"    :key="item.id"    v-show="item.id === pageId">  </your-component> </div></template><script> import YourComponent from ''; import detailsPage from '../mixins/details-page' export default {  name: 'DetailsPage',  components: {YourComponent},  mixins: [detailsPage], }</script>