快捷導(dǎo)航

Vue + Vue-router 同名路由切換數(shù)據(jù)不更新的方法

更新時(shí)間：2017年11月20日 17:18:33 作者：M.M.F

本篇文章主要介紹了Vue + Vue-router 同名路由切換數(shù)據(jù)不更新的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

在默認(rèn)情況下, 同名路由之間的切換, 由于組件可以服用, 放在ready里獲取數(shù)據(jù), 是不會(huì)執(zhí)行的, 有兩種方法可以解決

注意: 該問題僅存在于 vue1

方法1: 將數(shù)據(jù)獲取放到route.data下~

route: {
  data({to: {params: { page }}}) {
    return Promise.all([
      this.getApi()
    ]).then(() => {

    })
  }
}

方法2: 設(shè)置route.canReuse = false, 強(qiáng)制組件不復(fù)用~

route: {
  canReuse() {
    return false
  }
},
ready() {
  var request = $.ajax({
    type: "POST",
    dataType: 'json',
    url: "api.php"
  });
  request.then((json) => {
    // balabala
  });
}

以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Electron自動(dòng)更新失效報(bào)錯(cuò)Error:?Object?has?been?destroyed的問題解決
本文主要講解如何解決?Error:?Object?has?been?destroyed?這個(gè)?Electron?中最常見的問題,以及?Electron?自動(dòng)更新的流程,文中通過代碼示例給大家講解的非常詳細(xì),需要的朋友可以參考下
2024-01-01
vue使用npm發(fā)布自己的公網(wǎng)包
本文主要介紹了vue使用npm發(fā)布自己的公網(wǎng)包,通過創(chuàng)建一個(gè)簡單的npm包,本文詳細(xì)闡述了從創(chuàng)建到發(fā)布的整個(gè)過程,具有一定的參考價(jià)值,感興趣的可以了解一下
2023-08-08
element-ui配合node實(shí)現(xiàn)自定義上傳文件方式
這篇文章主要介紹了element-ui配合node實(shí)現(xiàn)自定義上傳文件方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-09-09
vue中@click如何綁定多個(gè)事件
這篇文章主要介紹了vue中@click如何綁定多個(gè)事件問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2023-11-11
vue項(xiàng)目接口訪問地址設(shè)置方式
這篇文章主要介紹了vue項(xiàng)目接口訪問地址設(shè)置方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2023-11-11
webpack4打包vue前端多頁面項(xiàng)目
這篇文章主要介紹了webpack4打包vue前端多頁面項(xiàng)目的相關(guān)知識(shí)，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2018-09-09
基于vue,vue-router, vuex及addRoutes進(jìn)行權(quán)限控制問題
這篇文章主要介紹了基于vue，vue-router, vuex及addRoutes進(jìn)行權(quán)限控制問題,需要的朋友可以參考下
2018-05-05
Vue項(xiàng)目業(yè)務(wù)邏輯模塊介紹
這篇文章主要介紹了Vue項(xiàng)目業(yè)務(wù)邏輯，不同的項(xiàng)目有不同的功能，不同的功能需要不同的實(shí)現(xiàn)，實(shí)現(xiàn)這些核心功能的代碼就叫業(yè)務(wù)邏輯。所以說業(yè)務(wù)邏輯是指一個(gè)實(shí)體單元為了向另一個(gè)實(shí)體單元提供服務(wù)，應(yīng)該具備的規(guī)則與流程
2022-11-11
vue組件表單數(shù)據(jù)回顯驗(yàn)證及提交的實(shí)例代碼
今天小編就為大家分享一篇vue組件表單數(shù)據(jù)回顯驗(yàn)證及提交的實(shí)例代碼，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-08-08
Vue組件間的雙向綁定示例解析
這篇文章主要介紹了Vue組件間的雙向綁定，我們都知道當(dāng)父組件改變了某個(gè)值后，如果這個(gè)值傳給了子組件，那么子組件也會(huì)自動(dòng)跟著改變，但是這是單向的，使用v-bind的方式，即子組件可以使用父組件的值，但是不能改變這個(gè)值
2023-03-03