vux 使用 loading 组件
1)声明引入Loading
import { Loading } from 'vux'
2)在模版底部添加 组件(需要添加到 template>div 标签里)
<template>
<div>
……
<loading v-model="showLoading" :text="loadText"></loading>
</div>
</template>
3)通过控制 showLoading 变量 和 loadText 变量即可控制 Loading 组件
export default {
components: {
AjaxPlugin,
Loading
},
data () {
return {
showLoading: false,
loadText: 'Loading',
articleList: this.getArticleList(1)
}
},
methods: {
getArticleList: function (catId) {
let _this = this _this.showLoading = true htttpRequest('/api', {method: 'article.getList', 'catId': catId}, function (data) {
_this.showLoading = false
_this.articleList = data.Result.ArticleList
})
return []
}
}
}
完
vux 使用 loading 组件的更多相关文章
- [Loading Component]Loading组件的v-model设计是否不合理?
vue在2.4.2版本中给computed里的属性加了限制,详见assigning to a computed property without setter does not fail 项目将vue ...
- ReactJS实践(一)—— FrozenUI React化之Loading组件
在前面我们通过四篇文章入门了React的大部分主要API,现在则开始进入实践环节. 实践系列的开篇打算拿我司的FrozenUI来试验,将其部分UI组件进行React化,作为第一篇实践文章,将以较简单的 ...
- Vue系列:在vux的popup组件中使用百度地图遇到显示不全的问题
问题描述: 将百度地图封装成一个独立的组件BMapComponent,具体见 Vue系列:如何将百度地图包装成Vue的组件(http://www.cnblogs.com/strinkbug/p/576 ...
- Vue 封装的loading组件
<template> <div class="loadEffect"> <span></span> <span>< ...
- React Native封装Toast与加载Loading组件
React Native开发封装Toast与加载Loading组件 在App开发中,我们避免不了使用的两个组件,一个Toast,一个网络加载Loading,在RN开发中,也是一样,React Nati ...
- Angular23 loading组件、路由配置、子路由配置、路由懒加载配置
1 需求 由于Angular是单页面的应用,所以在进行数据刷新是进行的局部刷新:在进行数据刷新时从浏览器发出请求到后台响应数据是有时间延迟的,所以在这段时间就需要进行遮罩处理来提示用户系统正在请求数据 ...
- vue2.0 仿手机新闻站(五)全局的 loading 组件
1.组件结构 index.js const LoadingComponent = require('./Loading.vue') const loading = { install: functio ...
- 小程序使用wepy框架自定义loading组件
1:定义组 <template> <view class="app-loading-container" style="{{options.cssTex ...
- 微信小程序把玩(二十五)loading组件
原文:微信小程序把玩(二十五)loading组件 loading通常使用在请求网络数据时的一种方式,通过hidden属性设置显示与否 主要属性: wxml <!----> <butt ...
随机推荐
- HTML5规范尘埃落定,5个开发工具推荐
HTML5规范终于在今年正式定稿,对于从事多年HTML5开发的人员来说绝对是一个重大新闻.数字天堂董事长,DCloud CEO王安也发表了文章,从开发者和用户两个角度分析了HTML对两个人群的优势.其 ...
- Java Servlet生成JSON格式数据并用jQuery显示
1.Servlet通过json-lib生成JSON格式的数据 import java.io.IOException;import java.io.PrintWriter;import java.uti ...
- 关于GO语言遇到illegal UTF-8 encoding 随手记录
在使用汉字的时候会报错 解决方案 editpad++ 修改编码为UTF-8 保存就可以了~bingo
- 【转】android如何实现开机自动启动Service或app
1.今天我们主要来探讨android怎么让一个service开机自动启动功能的实现.Android手机在启动的过程中会触发一个Standard Broadcast Action,名字叫android. ...
- C语言中重要的小知识汇总
用于整理记录一些C语言下的小知识点: 1. 在C语言中,怎么查看一个数据类型占用了多少个字节大小呢? 可以使用sizeof(int)/sizeof(double)等来查看某数据类型到底用了几个字节: ...
- C++ 查询某个变量的类型
#include <typeinfo> int iii = 100; printf("%s\n",typeid(iii).name());//类型 详见:http:// ...
- Response.Redirect与Server.Transfer区别-转
执行过程: 1.浏览器ASP文件请求->服务器执行->遇到response.redirect语句->服务器发送response.redirect后面的地址给客户机端的浏览器-> ...
- 手机web——自适应网页设计(html/css控制)http://mobile.51cto.com/ahot-409516.htm
http://mobile.51cto.com/ahot-409516.htm 一. 允许网页宽度自动调整: "自适应网页设计"到底是怎么做到的? 其实并不难. 首先,在网页代码的 ...
- 指定webapi 返回 json 格式 ; GlobalConfiguration.Configuration.Formatters.Clear()
因为 Internet Explorer 和 Firefox 发送了不同的 Accept 头,所以 web API 在响应里就发送了不同的内容类型. 解决方法,在 Global.asax的 App ...
- [原创]RX801SJ 实时时钟RTC调试纪要 : 时钟输出设置
利用USB转I2C/SPI/UART板进行通信测试 1.RX8010SJ的I2C通信地址定义如下: 设备读取地址:0X65 设备写入地址:0X64 2.USB2ish0转接板操作界面如下: 3.参 ...