this.$router.push({
          name: "Result",
          query: {
            // 發(fā)送搜索詞給result
            title: this.inputVal,
          },

 watch: {
    // 監(jiān)視搜索詞變化
    "$route.query.title": {
      immediate: true,
      handler() {
        this.search();
      },
    },
  },

 data() {
    return {
      searchVal:this.$route.query.title,
      }
   }
 watch: {
    // 監(jiān)視搜索詞變化
    searchVal: {
      immediate: true,
      deep: true,
      handler() {
        console.log("a");
        this.search();
      },
    },
  },

watch: { // watch的第一種寫法
$route (to, from) {
console.log(to)
console.log(from)
}
},
watch: { // watch的第二種寫法
$route: {
handler (to, from){
console.log(to)
console.log(from)
},
// 深度觀察監(jiān)聽
deep: true
}
},
watch: { // watch的第三種寫法
'$route':'getPath'
},
methods: {
getPath(to, from){
console.log(this.$route.path);
}
},
----------------------------------------------------------------
舉例：
watch: {
// 方法1 //監(jiān)聽路由是否變化
'$route' (to, from) {
if(to.query.id !== from.query.id){
this.id = to.query.id;
this.init();//重新加載數(shù)據(jù)
}
}
}
//方法 2 設(shè)置路徑變化時(shí)的處理函數(shù)
watch: {
'$route': {
handler: 'init',
immediate: true
}
為了實(shí)現(xiàn)這樣的效果可以給router-view添加一個(gè)不同的key，這樣即使是公用組件，只要url變化了，就一定會(huì)重新創(chuàng)建這個(gè)組件。
<router-view :key="$route.fullpath"></router-view>

beforeRouteEnter (to, from, next) {
console.log('beforeRouteEnter被調(diào)用：在渲染該組件的對應(yīng)路由被 confirm 前調(diào)用')
// 在渲染該組件的對應(yīng)路由被 confirm 前調(diào)用
// 不！能！獲取組件實(shí)例 `this` 因?yàn)楫?dāng)守衛(wèi)執(zhí)行前，組件實(shí)例還沒被創(chuàng)建
// 可以通過傳一個(gè)回調(diào)給 next來訪問組件實(shí)例。在導(dǎo)航被確認(rèn)的時(shí)候執(zhí)行回調(diào)，并且把組件實(shí)例作為回調(diào)方法的參數(shù)。
next(vm => {
// 通過 `vm` 訪問組件實(shí)例
console.log(vm)
})
},
// beforeRouteEnter 是支持給 next 傳遞回調(diào)的唯一守衛(wèi)。
// 對于 beforeRouteUpdate 和 beforeRouteLeave 來說，this 已經(jīng)可用了，所以不支持傳遞回調(diào)，因?yàn)闆]有必要了。
beforeRouteUpdate (to, from, next) {
// 在當(dāng)前路由改變，但是該組件被復(fù)用時(shí)調(diào)用
// 舉例來說，對于一個(gè)帶有動(dòng)態(tài)參數(shù)的路徑 /foo/:id，在 /foo/1 和 /foo/2 之間跳轉(zhuǎn)的時(shí)候，
// 由于會(huì)渲染同樣的 Foo 組件，因此組件實(shí)例會(huì)被復(fù)用。而這個(gè)鉤子就會(huì)在這個(gè)情況下被調(diào)用。
// 可以訪問組件實(shí)例 `this`
console.log('beforeRouteUpdate被調(diào)用：在當(dāng)前路由改變，但是該組件被復(fù)用時(shí)調(diào)用')
next()
},
beforeRouteLeave (to, from, next) {
// 導(dǎo)航離開該組件的對應(yīng)路由時(shí)調(diào)用
// 可以訪問組件實(shí)例 `this`
const answer = window.confirm('是否確認(rèn)離開當(dāng)前頁面')
if (answer) {
console.log('beforeRouteLeave被調(diào)用：導(dǎo)航離開該組件的對應(yīng)路由時(shí)調(diào)用')
next()
} else {
next(false)
}
},