Vue进阶(一):v-loading实现加载效果

2023-11-04

原文链接:https://blog.csdn.net/sunhuaqiang1/article/details/95474410

使用v-loading在接口为请求到数据之前,显示加载中,直到请求到数据后消失。

//全局loading
<template>
    <div v-loading="loading"> </div>
</template>

在data 中定义初始化, loading: false,同时在mounted()中将 this.loading设置为true,再去请求接口

在接口的回调函数中,将 this.loading 设为false,到达效果。

如果写在template下的顶层元素上的话,就不会触发全屏loading

//局部loading
<template>
    <div> 
        <section v-loading="loading"></section>
    </div>
</template>


 

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vue进阶(一):v-loading实现加载效果 的相关文章

  • Proteus实现555计时器模拟简易电子琴

    555计时器模拟简易电子琴 一 元器件介绍 二 原理分析 三 仿真实验 实现弹奏过程 一 元器件介绍 这里用到的元器件有 RESISTOR 电阻器 CAP 电容器 BUTTON 按钮 555 555计时器 BUZZER ACTIVE 有源蜂
  • Nacos 搭建和使用

    说明 官方文档 https nacos io zh cn docs what is nacos html 粘贴一下Nacos地图 逻辑架构及其组件介绍 服务管理 实现服务CRUD 域名CRUD 服务健康状态检查 服务权重管理等功能 配置管理

随机推荐

  • 4G网关8305LN远程监控西门子触摸屏SMART 700IE ZLAN8305LN应用

    1 概述 ZLAN8305LN是一款专门为工业环境设计的RS485设备数据采集器 物联网网关 他通过4G的方式传输 结合卓岚特有的P2P技术 无需构建公网服务器也可以同样随时随地采集设备的数据 本次案例主要是实现目的 对SMART700IE
  • 涉及Radio传值的写法

    博主最近在帮朋友做毕设 需要新增一个功能 功能里面有个radio列表 需要传radio元素的id值到后台 尝试了好多种写法都不行 最后用了下面的写法就好 后台顺利接收到参数 话不多说 直接上图 要如图红框里面的写法才能取到被选中的选项ID的
  • Mysql8.0的安装与配置(图文超详细)

    MySQL8 0安装配置 1 软件下载 2 软件安装 3 软件配置 4 环境变量配置 1 软件下载 链接 https pan baidu com s 1gyNz1o7SCyLIfoNcBUKRIQ 提取码 ajpl 2 软件安装 1 下载好
  • vue 收藏和取消收藏的点击事件

    描述 点击 取消收藏 图标切换 文字变为 收藏 收藏状态变为 未收藏 刷新页面 未收藏 数据不再显示 思路 通过if判断 给定这条数据一个状态 点击改变状态值 状态需要后端在接口里返回 未点击时 图标亮 状态为true 点击时 图标灰 数据
  • Qt 自定义数据类型在信号和槽中的传递

    Qt 信号和槽函数参数只能是基于 Qt 的基础类型的 比如 QString int bool 等 如果想传递自定义类型默认情况下是行不通的 下面以结构体为例 实现结构体类型数据的传递 头文件 ifndef MAINWINDOW H defi
  • 可视化分组散点图并添加分层线性回归模型的拟合曲线(使用R语言)

    可视化分组散点图并添加分层线性回归模型的拟合曲线 使用R语言 在数据分析和可视化中 经常需要绘制散点图以观察两个变量之间的关系 并使用回归模型来拟合数据 本文将介绍如何使用R语言创建分组散点图 并添加分层线性回归模型的拟合曲线 首先 我们需
  • 【操作系统】王道考研 p50-51 文件的物理结构(文件分配方式)

    文件的物理结构 上 文件的物理结构 下 知识总览 文件块 磁盘块 磁盘块的大小与内存块 页面的大小相同 内存与磁盘之间的数据交换以 块 为单位 在外存管理中 文件的逻辑地址空间被分为一个个文件块 连续分配 连续分配要求每个文件在磁盘上占有一
  • Integer的缓存机制、自动装箱拆箱

    一 什么是自动装箱拆箱 很简单 下面两句代码就可以看到装箱和拆箱过程 自动装箱 Integer total 99 自动拆箱 int totalprim total 简单一点说 装箱就是自动将基本数据类型转换为包装器类型 拆箱就是自动将包装器
  • 五行中的土在哪个方位_五行代表的方位

    五行方位 东 南 中 西 北 论 五 行 生 成 五行是构成宇宙万物的五种元素 它们是变化无穷 高深莫测的 五行的创立 準确地模拟了自然界的状态 宇宙万物的生息变化都不能离开五行 五行的顺序 一水 二火 叁木 四金 五土 这个顺序列取决于地
  • go性能优化

    常规手段 1 sync Pool 临时对象池应该是对可读性影响最小且优化效果显著的手段 最典型的就是fasthttp了 它几乎把所有的对象都用sync Pool维护 但这样的复用不一定全是合理的 比如在fasthttp中 传递上下文相关信息
  • 【故障诊断】基于最小熵反卷积、最大相关峰度反卷积和最大二阶环平稳盲反卷积等盲反卷积方法在机械故障诊断中的应用研究(Matlab代码实现)

    个人主页 研学社的博客 欢迎来到本博客 博主优势 博客内容尽量做到思维缜密 逻辑清晰 为了方便读者 座右铭 行百里者 半于九十 本文目录如下 目录 1 概述 2 运行结果 2 1 稀疏最大谐波噪声比反卷积 2 2 最大相关峰度反卷积 2 3
  • 认知计算导论自救版笔记

    认知计算导论 认知数据收集 认知cognitive数据 1 定义 认知物联网IoT 认知系统和互联网组合 认知数据来源 物理世界 互联网提供大量数据 虚拟世界 社交网络和移动计算 人群感知Crowd Sensing 大量人群通过移动设备无意
  • vst开启语音服务器,VST语音遥控器体验记

    体验信息 101245hu4k1a42krae4l4s jpg 10 39 KB 下载次数 5 2015 5 30 16 34 上传物品名称 VST智能语音遥控器适配物品 101502huualwallumcbaaa jpg 3 35 KB
  • 基于数组的链表AList

    快考试了 作为数据结构的复习 那么就把代码背打一遍好了 虽然代码很简单 但是把基础打牢固对以后的学习肯定是百益而无一害 正好也练练C 模板和指针以及代码书写的模块化 否则天天写些算法程序 一写就一大坨 乱乱的 养成习惯就悲剧了 看一点写一点
  • 梅尔频率倒谱系数(MFCC)

    https blog csdn net zkl99999 article details 80723755
  • winform中如何设置splitContainer中panel的宽度,并在以后的拖动中保持不变

    搜先随便选着一个penel 按Esc键这时你会选择这个splitContainer控件 假如 你要固定penel1 这时你需要先拖动splitContainer控件 让penel1全部显示出来 然后在splitContainer控件的属性中
  • 一、Gradle入门

    文章目录 一 Gradle入门 1 1 Gradle 简介 1 2 常见的项目构建工具 1 3 Gradle 安装 1 3 1 Gradle 安装说明 1 3 2 安装 JDK 1 3 3 下载并解压到指定目录 1 3 4 配置环境变量 1
  • 关于typedef的用法总结

    typedef的应用 typedef是C 语言中用于为现有数据类型指定替代名称的关键字 它主要用于用户定义的数据类型 当数据类型的名称在程序中使用变得稍微复杂时 以下是使用的一般语法 typedef
  • Pytorch框架学习 -2 torch.nn.modules.Module(nn.Module)理解

    文章目录 Pytorch框架学习 2 torch nn modules Module nn Module 理解 最简单的例子 分析 部分源码 基本参数 dump patches version training 初始化函数 paramete
  • Vue进阶(一):v-loading实现加载效果

    原文链接 https blog csdn net sunhuaqiang1 article details 95474410 使用v loading在接口为请求到数据之前 显示加载中 直到请求到数据后消失 全局loading