keep-alive内置组将能将浏览信息暂时保存起来
Vue.use(VueRouter);
var Series = {
template: <div> 付费栏目 </div>
,
created() {
console.log(‘付费栏目组件created‘);
},
mounted() {
console.log(‘付费栏目组件mounted‘);
},
destroyed() {
console.log(‘付费栏目组件被销毁了‘);
}
};
var Topics = {
template: <div> <h3 @click = ‘clickHander‘>我是专题广场</h3> </div>
,
methods: {
clickHander(e) {
e.target.style.color = ‘red‘;
}
},
created() {
console.log(‘专题广场组件created‘);
},
mounted() {
console.log(‘专题广场组件mounted‘);
},
destroyed() {
console.log(‘专题广场组件被销毁了‘);
}
};
var router = new VueRouter({
routes: [{
path: ‘/series‘,
component: Series
},
{
path: ‘/topics‘,
component: Topics
},
]
});
var App = {
template: <div> <router-link to = ‘/series‘>付费栏目</router-link> <router-link to = ‘/topics‘>专题广场</router-link> <keep-alive> <router-view></router-view> </keep-alive> </div>
,
}
new Vue({
el: ‘#app‘,
template: <App />
,
components: {
App
},
router,
});
原文:https://www.cnblogs.com/191080438qq/p/14749619.html