Keep-alive invalidity problem and solution

Keep-alive include and exclude are invalid

• include: Vue page that makes the tag work on all the values ​​of the name attributes consistent with the attribute values ​​of the tag include
• exclude: Vue page that makes this tag not work on all the value of the name attribute consistent with the attribute value of this tag exclude

Then I fell into the pit and configured a bunch of routed names! ! ! ! ! invalid! ! !

Using the include/exclude property requires assigning values ​​to the names of all vue classes (Note that the route name is not assigned to the）

Otherwise include/exclude will not take effect

Correct writing

export default {
 name:'a', // include or exclude name used by include data () {
 return{
    }
  },
}

routing

   // Components that keep name a and b   <keep-alive include="a,b">
        <router-view/>
   </keep-alive>

After vue2.0, the keep-alive built-in component has encapsulated two properties.

include and exclude means that those components need to be cached and those components do not need to be cached.

usage

It is roughly as follows:

<keep-alive include="test-keep-alive">
  <!-- Will cachenamefortest-keep-aliveComponents of -->
  <component></component>
</keep-alive>
 
<keep-alive include="a,b">
  <!-- Will cachenameforaorbComponents of，Use in combination with dynamic components -->
  <component :is="view"></component>
</keep-alive>
 
<!-- Using regular expressions，Need to usev-bind -->
<keep-alive :include="/a|b/">
  <component :is="view"></component>
</keep-alive>
 
<!-- Dynamic judgment -->
<keep-alive :include="includedComponents">
  <router-view></router-view>
</keep-alive>
 
<keep-alive exclude="test-keep-alive">
  <!-- Will not cachenamefortest-keep-aliveComponents of -->
  <component></component>
</keep-alive>

in addition:

The two life cycle functions activated and deactivated must be only available after using the keep-alive component, otherwise it will not exist.

Summarize

The above is personal experience. I hope you can give you a reference and I hope you can support me more.