vue中如何做按钮点击后页面刷新的功能
Admin 2022-08-12 群英技术资讯 1970 次浏览
今天小编跟大家讲解下有关“vue中如何做按钮点击后页面刷新的功能”的内容 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了相关资料,希望小伙伴们看了有所帮助。首先从子组件和父组件角度去写这个东西,简言之就是在父组件中实现这个刷新功能方法,然后在子组件中进行绑定并进行监听就好了啊
① 图示部分:
个人建议这个作为父组件,肯定一般是放在列表中的,即把列表页面作为父组件的归属地

② 代码部分:
method方法中部分
refresh () {
this.reload()
}
将reload进行注入
inject: ['reload'],
① 子组件进行绑定
在父组件中引用子组件页面的地方进行绑定
如图:

绑定脚本:
@refresh="refresh"
② 单独去子组件页面处理成功的地方去监听
图示:比如就以这个页面为例子

进入子页面:

在子页面组件中处理成功后进行监听父组件中刷新方法,以上设置完就ok了
在按钮点击事件中添加
window.location.reload();
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
页面跳转,我们一般都通过路由跳转实现,通常情况下可直接使用router-link标签实现页面跳转,下面这篇文章主要给大家介绍了关于vue如何通过点击事件实现页面跳转的相关资料,需要的朋友可以参考下
sockjs-node报错是啥原因?sockjs-node接口报错的原因有很多,可能是热加载功能失效,还可能是shadowsock代理、nodejs配置等等,要解决保持的问题,先判断出原因很重要的。针对下文的情况,我们来看看是什么原因及如何解决。
今天我们来了解一下vuex,下文会给大家分享vuex中四大对象state、mutations、getters、actions以及他们的用法,对新手学习和理解vuex对象有一定的帮助,感兴趣的朋友就继续往下看吧。
这篇文章主要讲解JavaScript严格模式不支持八进制的问题,本文围绕JavaScript严格模式展开内容,详细介绍为什么JavaScript严格模式不支持八进制,下面来看看详细介绍,需要的朋友可以参考一下
直接上代码:!DOCTYPE htmlhtml lang=en head meta charset=UTF-8 meta http-equiv=X-UA-Compatible content=IE=edge meta name=viewport content=width=device-width,
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 ICP核准(ICP备案)粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008