vue中按钮操作完刷新页面的实现

 更新时间:2022年07月06日 11:54:52   作者:醉梦洛  
这篇文章主要介绍了vue中按钮操作完刷新页面的实现方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

vue按钮操作完刷新页面

首先从子组件和父组件角度去写这个东西,简言之就是在父组件中实现这个刷新功能方法,然后在子组件中进行绑定并进行监听就好了啊

1.父组件中实现

① 图示部分:

个人建议这个作为父组件,肯定一般是放在列表中的,即把列表页面作为父组件的归属地

② 代码部分:

method方法中部分

refresh () {
   this.reload()
 }

将reload进行注入

inject: ['reload'],

2.子组件绑定

① 子组件进行绑定

在父组件中引用子组件页面的地方进行绑定

如图:

绑定脚本:

@refresh="refresh"

② 单独去子组件页面处理成功的地方去监听

图示:比如就以这个页面为例子

 进入子页面:

在子页面组件中处理成功后进行监听父组件中刷新方法,以上设置完就ok了

点击按钮后自动刷新页面

在按钮点击事件中添加

window.location.reload();

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Vue如何实现多页面配置以及打包方式

    Vue如何实现多页面配置以及打包方式

    这篇文章主要介绍了Vue如何实现多页面配置以及打包方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • vue引用外部JS的两种种方法

    vue引用外部JS的两种种方法

    这篇文章主要介绍了vue引用外部JS的两种种方案,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-01-01
  • Vue实现boradcast和dispatch的示例

    Vue实现boradcast和dispatch的示例

    这篇文章主要介绍了Vue实现boradcast和dispatch的示例,帮助大家更好的理解和使用vue,感兴趣的朋友可以了解下
    2020-11-11
  • vue3 使用 vue3-video-play实现在线视频播放

    vue3 使用 vue3-video-play实现在线视频播放

    这篇文章主要介绍了vue3 使用 vue3-video-play 进行在线视频播放,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-06-06
  • vue data中如何获取使用store中的变量

    vue data中如何获取使用store中的变量

    这篇文章主要介绍了vue data中如何获取使用store中的变量,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-03-03
  • vue中的slot封装组件弹窗

    vue中的slot封装组件弹窗

    这篇文章主要介绍了vue中的slot封装组件弹窗,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-05-05
  • Ant Design Vue Pagination分页组件的封装与使用

    Ant Design Vue Pagination分页组件的封装与使用

    这篇文章主要介绍了Ant Design Vue Pagination分页组件的封装与使用方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-04-04
  • 前端之vue3使用WebSocket的详细步骤

    前端之vue3使用WebSocket的详细步骤

    websocket实现的全双工通信,真真太香了,下面这篇文章主要给大家介绍了关于前端之vue3使用WebSocket的详细步骤,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-11-11
  • vue 导航锚点_点击平滑滚动,导航栏对应变化详解

    vue 导航锚点_点击平滑滚动,导航栏对应变化详解

    这篇文章主要介绍了vue 导航锚点_点击平滑滚动,导航栏对应变化详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-08-08
  • vue 实现复制内容到粘贴板clipboard的方法

    vue 实现复制内容到粘贴板clipboard的方法

    下面小编就为大家分享一篇vue 实现复制内容到粘贴板clipboard的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-03-03

最新评论