loading的使用

您所在的位置:网站首页 false是名词吗 loading的使用

loading的使用

2024-07-08 03:08| 来源: 网络整理| 查看: 265

loading可以实现的效果

在请求的数据没有返回时,实现加载的效果。原始的效果是比较简单的蓝线圆的转动,但是可以通过CSS改变它的样式,比如这样的在这里插入图片描述

使用loading的思路 第一种:此区域只有一个接口的

第一步、在需要请求接口的区域加上loading,比如表单,或是下拉框 在这里插入图片描述 第二步、需要在return那里声明你在第一步绑定的loading(要声明的是你的loading的名字,也就是等号后面的那个命名) 格式: loading: false 或者是 loading: true 【这个loading是自己命名的】 第三步、在调用接口的地方使用loading 1、如果是 loading: false ,则在调用接口之前将loading开启,即将loading设为true(this.loading = true) ,在接口调用数据进行一堆操作之后将loading关闭,即职位false(this.loading = false) 2、如果是loading: true,则在调用接口之后可以使用if去判断关闭 if(this.loading) { this.loading = false }

第二种:此区域调用了多个接口

第一步、确定此区域调用了几个接口,在return那里声明一个变量interfaceCount是他等于接口数(interfaceCount: 2) 第二步、在每个调用的接口后面使得–interfaceCount 第三步、在wacth监听变化 interfaceCount(newValue) { if (newValue === 0) { this.loading = false } },

补:v-loding="loading"和 :loading="loading"的区别 1、一般v-loading用于表单、弹框的加载 2、:loading一般用于各种框的加载

PS:如有不对,请各位大佬指正



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3