vue (v-if show 问题)
vue中的显示和隐藏有两种方式
1.v-if ( 相当于动态创建的标签,在html 结构中,是不存在的。 )
2. v-show(控制的是 html 的css display:none 属性。结构体是存在的)
问题?
在使用v-if 的时候,通过props 接收的值,有的时候是 undefined,或者是报错。
自己验证解决:
vue 的生命周期 会在当所有的 DOM数结构渲染完毕的时候,在进行vue 中的一些基本的数据传值,双向数据绑定,渲染组件。 所以,当我们通过父组件 传值的时候,如果是 v-if ,动态添加 dom 数结构。根据生命周期的顺序,props 接收的值,会是undefined 。
所以,在一般的情况下,如果考虑到会操作DOM 的时候,我们选用v- show。
反之,我们用 v-if 。
( 子组件,建议使用 v- if )
如果有说的不是很合理的地方,希望走过,路过的大牛,帮忙指点。
vue (v-if show 问题)的更多相关文章
- vue.js在windows本地下搭建环境和创建项目
Vue.js是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.另一方面,Vu ...
- windows下vue+webpack前端开发环境搭建及nginx部署
一.开发环境搭建 1.前端框架一般都依赖nodejs,我们首先要安装node.js.请参考http://www.cnblogs.com/wuac/p/6381819.html. 2.由于许多npm的源 ...
- Vue.js的从入门到放弃进击录(二)
哇塞,昨晚更新的篇(一)这么多阅读量,看来入坑的人越来越多啦~熬了一个礼拜夜,今天终于生病惹~国庆要肥家咯·所以把篇(二)也更完.希望各位入坑的小伙伴能少跳几个坑呗.如果有什么不对的地方也欢迎讨论指正 ...
- vue初级学习--环境搭建
一.导语 最近总想学点东西,es6啊.typescript啊,都想学,刚好有个机遇,可以学点vue,嗯,那就开始吧. 二.正文 1.node环境: 下载安装nodeJs,最好是1.6以上的版本,下载地 ...
- 前端MVC Vue2学习总结(二)——Vue的实例、生命周期与Vue脚手架(vue-cli)
一.Vue的实例 1.1.创建一个 Vue 的实例 每个 Vue 应用都是通过 Vue 函数创建一个新的 Vue 实例开始的: var vm = new Vue({ // 选项 }) 虽然没有完全遵循 ...
- 【vue系列之三】从一个vue-pdf-shower,说说vue组件和npm包
前言 从去年年初开始,自己便下决心要写一个vue系列的博客,但时至今日,才写系列的第三篇博客,想来甚是惭愧. 但是慢归慢,每一篇都要保证质量,以及要写出自己的心路历程,防止自己工作中填的坑再让读者走一 ...
- 怎么看vue版本
查看vue版本号是 vue -V 而不是npm vue -v ,npm vue -v 等同于npm -v vue -V: 后面那个V是大写的.
- vue不是内部或外部命令,配置一个Path系统变量就可以解决
作为一个vue小白,最近为vue安装真是操碎了心.无论怎么查找网上的教程,还是解决不了"vue不是内部或外部的命令"诸如此类的问题.好在功夫不负有心人,终于在多次的试验下,成功解决 ...
- 如何用vue实现树形菜单?
在公司培训了2周,布置的作业是从树形,grid分页以及echarts中选一个.由于都不是很熟,就挑了第一个.本来想在网上找找参考,然后模仿着做一个,但是网上的代码多少参差不齐,写到一半没了,所以只要自 ...
- vue初学者
先分享一波福利 vue学习视频 链接:https://pan.baidu.com/s/1ggSfE75 密码:7h2a 1.先安装 webpack vue-cli ...
随机推荐
- kotlin官方文档-1.0入门
什么是Kotlin? 图片发自简书App Kotlin是JetBrains开发的基于JVM的语言,JetBrains想必大家应该很熟悉了,他们创造了很多强大的IDE,android studio谷 ...
- [POI2002][HAOI2007]反素数 数论 搜索 好题
题目描述: 对于任何正整数x,其约数的个数记作g(x).例如g(1)=1.g(6)=4. 如果某个正整数x满足:g(x)>g(i) 0<i<x,则称x为反质数.例如,整数1,2,4, ...
- JS获取当前时间(YYYY-MM-DD ),element显示默认当前时间,显示默认昨天,显示默认上个月
原文链接:点我 进来的随便看看,或许有帮助 vue+element-ui datepicker 设置默认日期用的框架是vue+element-ui ,以下是时间控件 <el-form-ite ...
- Spring Boot学习总结(1)——Spring Boot入门
摘要:Spring Boots是为了帮助开发人员很容易的创建出独立运行和产品级别的基于 Spring 框架的应用. 从 Spring Boot 项目名称中的 Boot 可以看出来,Spring Boo ...
- 自己定义View之Chart图标系列(1)——点阵图
近期要做一些图表类的需求,一開始就去github上看了看,发现开源的图表框架还是蛮多的.可是非常少有全然符合我的需求的.另外就是使用起来比較麻烦.所以就决定自己来造轮子了~~~ 今天要介绍的就是And ...
- easyui combobox 获取焦点
easyui combobox 获取焦点 学习了:http://blog.csdn.net/foart/article/details/14446809 可以直接用: $('#spanZhudaoci ...
- libvirt 部分API 介绍
感谢朋友支持本博客.欢迎共同探讨交流,因为能力和时间有限,错误之处在所难免,欢迎指正! 假设转载,请保留作者信息. 博客地址:http://blog.csdn.net/qq_21398167 原博文地 ...
- legend---四、菜鸟教程css3里面有教你炫酷的按钮怎么做
legend---四.菜鸟教程css3里面有教你炫酷的按钮怎么做 一.总结 一句话总结:想学,总是有很多资料的 1. 自动居中是 margin:100px 0px;么? 自动居中是margin:100 ...
- 2015合肥网络赛 HDU 5492 Find a path 动归
HDU 5492 Find a path 题意:给你一个矩阵求一个路径使得 最小. 思路: 方法一:数据特别小,直接枚举权值和(n + m - 1) * aver,更新答案. 方法二:用f[i][j] ...
- Weka中数据挖掘与机器学习系列之Exploer界面(七)
不多说,直接上干货! Weka的Explorer(探索者)界面,是Weka的主要图形化用户界面,其全部功能都可通过菜单选择或表单填写进行访问.本博客将详细介绍Weka探索者界面的图形化用户界面.预处理 ...