当前位置： 首页 > article >正文

vue项目中添加刷新的按钮

article 2024/11/16 21:31:55

刷新功能

点击导航的刷新按钮，刷新下方主体内容，我这边的项目分为左-上-下结构，上边为tabbar组件，下边为main组件，点击刷新整个流程是刷新按钮，去访问它父组件tabbar的兄弟组件main，使main组件内容进行刷新。这就涉及到组件之间数据传递了。

在这里我使用的是pinia。在setting.ts设置一个变量refsh，方便main和tabbar访问。

点击刷新按钮，获取到仓库中的值进去取反

在main组件里判断仓库中的refsh是否发生变化，再搭配nextTick函数使用，就可以完成就可完成帅刷新的效果了。


http://www.kler.cn/a/159444.html

相关文章：

  • windows@多系统引导名字修改@默认引导系统修改@bcdedit配置
  • Springboot 使用EasyExcel导出含图片并设置样式的Excel文件
  • 【从零开始的LeetCode-算法】3239. 最少翻转次数使二进制矩阵回文 I
  • 前端知识点---this的用法 , this动态绑定(Javascript)
  • JavaScript 自动化软件：AutoX.js
  • 【Rust 编程语言工具】rustup-init.exe 安装与使用指南
  • C/C++ 前缀和与差分
  • 文章润色软件，免费的几款润色工具推荐
  • C语言速通笔记（41-62）
  • git submodule 用法
  • Python 调用企业微信群机器人发送消息及文件
  • flink源码分析之功能组件(四)-slot管理组件I
  • P5 Linux 标准C库函数
  • 嵌入式C语言中的关键字volatile
  • 【C++】三大特性 --- 继承的详细讲解
  • 数据结构初阶之二叉树性质练习与代码练习
  • 最新关于openai.APIConnectionError: Connection error.的解决方法
  • vr工业制造流程3D模拟仿真可视化展示
  • 批量AI创作文案的工具，批量AI创作文章的软件
  • Linux 如何解决磁盘空间没有扩大的问题。
  • 创建Asp.net MVC项目Ajax实现视图页面数据与后端Json传值显示
  • Pycharm修改文件默认打开方式 + CSV Editor插件使用
  • 小型洗衣机什么牌子好又便宜？性价比内衣洗衣机推荐
  • vue el-select多选封装及使用
  • 英伟达显卡驱动的相关组件和名词
  • Java安全之Commons Collections4分析