首页 > 其他分享 >项目中难点-页面点击“取消”按钮实现无感刷新--reload

项目中难点-页面点击“取消”按钮实现无感刷新--reload

时间:2023-11-07 10:49:00浏览次数:38  
标签:-- 刷新 reload 点击 按钮 无感 页面

1、在App.vue页面中注册provide中定义reload

provide(){
  return {
  reload:this.reload
 }
}

 

2、在App.vue页面中的methods中定义方法reload目的通过控制router-view的显示与隐藏进行重新加载页面,实现无感刷新。

reload(){
   this.isRouterAlive = false
   this.$nextTick(()=>{
      this.isRouterAlive=true
   })
}

 

3、在具体页面中使用点击按钮实现无感刷新。

(1)、注册reload

inject:["reload"]

如图:

(2)、点击按钮的时候进行调用this.reload()

如图:

 

标签:--,刷新,reload,点击,按钮,无感,页面
From: https://www.cnblogs.com/evident/p/17702617.html

相关文章

  • Linux学习笔记之SVN 查看最后的更新文件列表
    #输出最近20条信息svnlog-q#只输出版本号、时间、作者而不输出日志svnlog–xml#让日志以xml形式输出,这样主要是为了让日志编程一个有规则的xml文件,可以二次利用组合用svnlog-l20–xml-q>>result.xml#日志前20条,以xml文件的形式、且只有版本号、时间、作......
  • django的paginator都是假分页,数据量大很卡
    paginator使用defget(self,request,*args,**kwargs):rs_data={'count':0,'items':[]}page=int(self.request.GET.get('page',1))page_size=int(self.request......
  • [HTML]特殊字符
    https://www.runoob.com/html/html-entities.html 显示结果描述实体名称实体编号 空格&nbsp;&#160;<小于号<&#60;>大于号>&#62;&和号&amp;&#38;"引号"&#34;'撇号 &apos;(IE不支持)&#39;¢分&......
  • http://localhost:xxxxx/sockjs-node/info?t=1699323049868
    http://localhost:xxxxx/sockjs-node/info?t=1699323049868 sockjs-node是一个JavaScript库,提供跨浏览器JavaScript的API,创建了一个低延迟、全双工的浏览器和web服务器之间通信通道。解决办法: 配置devServer,然后重启项目1.在vue.config.js中找到devServer中加入 host:'l......
  • 支付宝沙箱的应用
    支付宝沙箱提供了一套模拟真实环境下的支付流程。大家想需要在项目中开发支付模块,可以采用支付宝沙箱进行开发是一个不错的选择1.登录支付宝开放平台,然后开启沙箱功能地址:支付宝开放平台(alipay.com)2.进入控制台,找到沙箱后获取或是查看密钥。密钥就是你进行沙箱开发的凭证......
  • 排序算法
    1.插入类排序1.1直接插入排序classSolution{publicvoidinsertSort(int[]arr,intn){inttmp;for(inti=1;i<n;i++){//将待插入的关键字暂存于tmp中tmp=arr[i];intj=i-1;/......
  • C语言 读取csv文件
    #include<stdio.h>#include<stdlib.h>#include<string.h>#defineMAX_LINE_SIZE1024intmain(){//打开要读取的CSV文件FILE*csvFile=fopen("data.csv","r");if(csvFile==NULL){perror("Faile......
  • 使用 JSON JavaScriptSerializer 进行序列化或反序列化时出错。字符串的长度超过了为
    一个报表的查询,用ajax调用的Service,查询条件没有问题,后台也能返回数据,就一直返回Error提示,F12看到是因为返回json时出错了 在web.config的configuration加以下代码即可解决<system.web.extensions><scripting><webServices><jsonSerializationmaxJs......
  • python3-TK实现一个可视化界面,选中文件夹可以计算文件夹下文件的数量
    借助Python3中Tkinter库,实现一个可视化的界面,通过界面选择文件夹,可以计算文件夹下文件的数量,嵌套文件夹的情况依旧可以计算。importosimporttkinterastkfromtkinterimportfiledialogdefcount_files_in_folder(folder_path):file_count=0forroot,dirs,......
  • 数据可视化 - 使用swiper制作滚动表格[vue3]
    html部分1<divclass="scroll-table">2<divclass="scroll-table-header">3<tableclass="scroll-table-header__table">4<colgroup>5<col......