首页 > 其他 > 详细

vue之keep-alive

时间:2021-05-10 10:55:13      阅读:16      评论:0      收藏:0      [点我收藏+]

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,

		});

vue之keep-alive

原文:https://www.cnblogs.com/191080438qq/p/14749619.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!