Refresh subcomponents under vue.js keep-alive

keep-alive, was introduced to save the number of pages in Pagination, which was added on the outermost part of App.vue, but the refresh of the subcomponents encountered a problem.

The path of the

sub-component is / subject/:id. I hope that each time the incoming id is captured in the sub-component, the new data will be obtained (the data acquisition is put in the mounted), but it will not be refreshed every time the keep-alive, is used.
then I thought of using watch:$route.params.id, but in this way watch will be activated twice when entering the subcomponent and leaving (id has changed twice). How can he capture changes in id only when he comes in?

if you have a problem with your thinking, please help to point it out. Thank you

Less node.js html5 html javascript

Apr.19,2021

you can put the number of Pagination pages in vuex or create a global variable, and then store it in localstorage.

data() {
  id: this.$route.id,
  watched: false
},
watch: {
   
    id: function (newId, oldId) {
      if (!this.watched) {
        doFetch();
      }
      this.watched = !this.watched;
    }
  },

I don't know that your vue version is hooked by keep-alive components in version 2.2.0 or above. You can operate in this hook

Previous: How can an error be reported when the parameter id is adjusted to the API in this way?

Next: Mouse hover specified element display, display element error

The returned array can be fetched at the beginning of the menu on-open-change event in iview2.13.1, but it will not be available if you click on it later.
...

Less node.js html5 html javascript

Mar.11,2021