vue_页面跳转实时刷新
vue组件和组件间使用router跳转的时候,除了首次实例化会加载数据,第二次进组件的时候,是不会再次实例化组件的,也就是调用的缓存,不能实时刷新组件。
涉及知识点:
created():在创建vue对象时,当html渲染之前就触发;但是注意,全局vue.js不强制刷新或者重启时只创建一次,也就是说,created()只会触发一次;
activated():在vue对象存活的情况下,进入当前存在activated()函数的页面时,一进入页面就触发;可用于初始化页面数据等;
beforeRouteEnter(to, from, next):进入路由之前执行的函数,写在组件里可根据路由进行页面判断或传值。
<template> </template> <script> export default { data() { return {} }, activated(){ if (this.$route.meta.isFresh) { init(); }else{} this.$route.meta.isFresh = false;//记得这里一定要设置一下false。 }, methods:{ init(){}, }, beforeRouteEnter(to, from, next) { if (from.name == 'Index') { to.meta.isFresh = true; } next(); } } </script> <style> </style>
也就是说,每次进入组件都会进入beforeRouteEnter()和activated(),在这两个钩子函数定义初始化init()逻辑。
“世界是个叙述者, 而我们却蒙上黑布, 嗤之以鼻。”