vue数据改变页面不刷新(vue列表数据删除后主动刷新页面及刷新方法详解)
类别:编程学习 浏览量:2636
时间:2022-04-02 14:05:27 vue数据改变页面不刷新
vue列表数据删除后主动刷新页面及刷新方法详解问题描述:
前端删除一条数据或者新增数据后,后端操作成功,但前端不会自动刷新,需要重新刷新当前页面
(用vue-router重新路由到当前页面,页面是不进行刷新的 ,采用window.reload(),或者router.go(0)刷新时,整个浏览器进行了重新加载)
解决:
provide / inject 组合
作用:允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。
(声明reload方法,控制router-view的显示或隐藏,从而控制页面的再次加载)
App.vue 代码:
<template> <li id="app"> <router-view v-if="isRouterAlive"></router-view> </li> </template> <script> export default { name: 'App', components: {}, provide(){ return { reload: this.reload } }, data() { return { isRouterAlive: true, }; }, cread() {}, methods: { reload(){ this.isRouterAlive = false; this.$nextTick(function(){ this.isRouterAlive = true; }) } }, mounted() { }, } </script> <style> </style>
使用方式:
// 引用vue reload方法 inject: ['reload'], //在方法中调用 this.reload()
总是要在少年之时走的更好更远,才能不辜负自己和背后的坚定!加油!
总结
到此这篇关于vue列表数据删除后主动刷新页面及刷新方法的文章就介绍到这了,更多相关vue列表数据删除后刷新内容请搜索开心学习网以前的文章或继续浏览下面的相关文章希望大家以后多多支持开心学习网!
您可能感兴趣
- vue统计代码行数(vue实现计数器简单制作)
- vue组件轮播(vue+rem自定义轮播图效果)
- vue本地图片切换(vue动态加载本地图片的处理方法)
- vue-router的两种模式(vue-route路由管理的安装与配置方法)
- vue路由跳转的方法(Vue路由监听实现同页面动态加载的示例)
- vue购物车简单项目(vue实现简单购物车案例)
- vue 怎么设置滚动条的长度(vue使用better-scroll实现横向滚动的方法实例)
- vue怎么引入axios(如何用vue封装axios请求)
- vue手动清除keepalive缓存(vue中keep-alive组件的用法示例)
- vue pdf预览插件(Vue-pdf实现在线预览PDF文件)
- vue 父组件传值(Vue两个同级组件传值实现)
- vue端口号是什么原理(解决vue前后端端口不一致的问题)
- vue-websocket 组件教程(Vue+express+Socket实现聊天功能)
- vue移动端图片放大效果实现(vue实现图片切换效果)
- vue组件开发步骤(解析如何自动化生成vue组件文档)
- vue-cli4开发多页面应用(深入理解Vue-cli4路由配置)
- 当年的 白洋淀战神 练肌肉 嘎子哥也成为行走的荷尔蒙(当年的白洋淀战神)
- 肌肉小子陈康, 亚洲巨兽 黄哲勋,哪个才是你的菜(肌肉小子陈康亚洲巨兽)
- 新闻周刊 青岛网红 赵厂长 编段子一箩筐输出快乐,陪父亲十二载勇斗病魔(新闻周刊青岛网红)
- 44岁夏雨演谋女郎爸,大其24岁却看不出,互动不怕袁泉吃醋(44岁夏雨演谋女郎爸)
- 全椒人,你还记得吗 那年,那人,那网,那些我们的青春记忆(全椒人你还记得吗)
- 全椒人在苏州10周年联谊会在苏州举办(全椒人在苏州10周年联谊会在苏州举办)
热门推荐
- dedecms调用点击数(织梦DEDECMS中显示复制地址,推荐给QQ/MSN上的好友的代码)
- idea配置tomcat启动web项目(如何在IntelliJ IDEA 2018上配置Tomcat并运行第一个JavaWeb项目)
- 如何布局网站的广告位
- mysql架构方案讲解(MySQL 搭建MHA架构部署的步骤)
- 云服务器操作系统怎么选(云服务器选择Linux还是windows操作系统比较好?)
- mysql模糊匹配语句(MySQL 数据库 like 语句通配符模糊查询小结)
- sql server 进阶(SqlServer AS的用法)
- linuxdocker启动报错提示参数无效(docker 报错 Exited 1 4 minutes ago的原因分析)
- ftp文件操作三种类型(详解ftp创建文件权限问题)
- 织梦网址首页如何布局(去掉织梦建站或者仿站时首页访问地址后的index.html)