vue生命周期回调方法
最近在用vue开发一个商品列表页,因需要根据请求回的字段是否有内容来显示隐藏该字段,
但因为vue异步加载导致显示隐藏方法不起作业(主要是判断条件取不到页面渲染内容),围观了vue生命周期后发现updated方法很好用
$(document).ready(function () {
switchList();
});
//展示接口请求
function switchList() {
$.ajax({
type:"POST",
timeout:3000,
url:"../../../static/b2b-reception/data/switchList.json",
success:function (obj) {
lineListId.todos=obj;
tabListId.todos=obj;
}
})
}
//列状展示循环渲染
var lineListId = new Vue({
el: '#line-list',
data: {
todos:[]
},
updated: function () {
newIcon();
}
});
//新品标签显示隐藏
function newIcon() {
$(".weui-mark-vip").each(function () {
if($(this).find("span").text()==""){
$(this).hide();
}
console.log($(this).find("span").text());
})
}
vue生命周期回调方法的更多相关文章
- Bean 注解(Annotation)配置(2)- Bean作用域与生命周期回调方法配置
Spring 系列教程 Spring 框架介绍 Spring 框架模块 Spring开发环境搭建(Eclipse) 创建一个简单的Spring应用 Spring 控制反转容器(Inversion of ...
- Bean XML 配置(2)- Bean作用域与生命周期回调方法配置
系列教程 Spring 框架介绍 Spring 框架模块 Spring开发环境搭建(Eclipse) 创建一个简单的Spring应用 Spring 控制反转容器(Inversion of Contro ...
- 我的Android进阶之旅------>Android服务的生命周期回调方法
先引用一段官网上的文字 ======================================================================================== ...
- Spring Bean生命周期回调方法
参阅官方文档:https://docs.spring.io/spring/docs/current/spring-framework-reference/core.html#beans-factory ...
- Android中服务的生命周期回调方法
- Vue基础进阶 之 Vue生命周期与钩子函数
Vue生命周期 Vue生命周期:Vue实例从创建到销毁的过程,称为Vue的生命周期: Vue生命周期示意图:https://cn.vuejs.org/v2/guide/instance.html#生命 ...
- Vue 生命周期方法
一.Vue 生命周期 Vue的生命周期即是实例从创建到销毁的一个过程.之前在学习Vue的时候,看过官网的教程,但是经常用到的是mounted,所以对其他生命周期方法不是很熟悉,这里有空做个总结,也方便 ...
- 04: vue生命周期和实例属性和方法
1.4 组件的生命周期 1.说明 1. Vue将组件看成是一个有生命的个体,跟人一样,定义了各个阶段, 2. 组件的生命周期:组件的创建过程 3. 组件生命周期钩子函数:当组件处在某个阶段,要执行某个 ...
- Vue系列(二):发送Ajax、JSONP请求、Vue生命周期及实例属性和方法、自定义指令与过渡
上一篇:Vue系列(一):简介.起步.常用指令.事件和属性.模板.过滤器 一. 发送AJAX请求 1. 简介 vue本身不支持发送AJAX请求,需要使用vue-resource.axios等插件实现 ...
随机推荐
- gulp的安装和使用
安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务 1.去nodejs官网安装nodejs 2. ...
- 基于IAR6或者IAR7建立STM32开发工程(通过实际测试,使用IAR6.30.4)
IAR和keil两个开发平台都是arm开发当中比较流行的平台,keil4的版本之间,可以兼容,但是版本4和版本5还是不兼容的,但是IAR的兼容性更加差,好像6.30.x之间是能够兼容的吧,没有实测过, ...
- STM32三种启动模式 boot0 boot1
STM32三种启动模式对应的存储介质均是芯片内置的,它们是: 1)用户闪存=芯片内置的Flash.2)SRAM=芯片内置的RAM区,就是内存啦.3)系统存储器=芯片内部一块特定的区域,芯片出厂时在这个 ...
- poj-1700 crossing river(贪心题)
题目描述: A group of N people wishes to go across a river with only one boat, which can at most carry tw ...
- The 2018 ACM-ICPC Chinese Collegiate Programming Contest Take Your Seat
/* 证明过程如下 :第一种情况:按1到n的顺序上飞机,1会随意选一个,剩下的上去时若与自己序号相同的座位空就坐下去,若被占了就也会随意选一个.求最后一个人坐在应坐位置的概率 */ #include ...
- Ubuntu超简单文书编辑器:nano
nano 的使用很简单,可以直接加上档名就能够开启一个旧档或新档! 直接在终端输入指令:nano text.txt,如下图所示打开的是已有的文档! 第一部分反白部分,是nano的版本与档名 第二部分可 ...
- 光学字符识别OCR-8 综合评估
数据验证 尽管在测试环境下模型工作良好,但是实践是检验真理的唯一标准.在本节中,我们通过自己的模型,与京东的测试数据进行比较验证. 衡量OCR系统的好坏有两部分内容:(1)是否成功地圈 ...
- day03 set集合,文件操作,字符编码以及函数式编程
嗯哼,第三天了 我们来get 下新技能,集合,个人认为集合就是用来list 比较的,就是把list 转换为set 然后做一些列表的比较啊求差值啊什么的. 先看怎么生成集合: list_s = [1,3 ...
- day01 项目
项目名称: 编写登陆接口 项目需求: 1 输入用户名密码 2 认证成功后显示欢迎信息 3 输错3次之后锁定,包括下次运行此程序也要锁定,涉及到持久化的问题只能用python 自 ...
- python - 接口自动化测试 - ReadExcel - 读取测试数据封装
# -*- coding:utf-8 -*- ''' @project: ApiAutoTest @author: Jimmy @file: read_excel.py @ide: PyCharm C ...