Vue实现页面的局部刷新(router-view页面刷新)
时间:2022-02-20 09:27:20|栏目:vue|点击: 次
利用Vue里面的
provide+inject
组合
首先需要修改App.vue。
<template> <!-- 公司管理 --> <div class="companyManage"> <router-view v-if="isRouterAlive"></router-view> </div> </template> <script> export default { name: "companyManage", watch: {}, provide() { return { reload:this.reload } }, data() { return { isRouterAlive:true }; }, methods: { reload() { this.isRouterAlive = false; this.$nextTick( () => { this.isRouterAlive = true; }) } }, mounted() {} }; </script> <style scoped> .companyManage { width: 100%; height: 100%; position: relative; background: #fff; } </style>
2. 到需要刷新的页面进行引用,使用inject导入引用reload,然后直接调用即可。
inject:["reload"], this.reload();
栏 目:vue
下一篇:Vue使用el-tree 懒加载进行增删改查功能的实现
本文标题:Vue实现页面的局部刷新(router-view页面刷新)
本文地址:http://www.codeinn.net/misctech/194017.html