vue-if和vue-show都是对条件进行判断,一直不明白他们的区别,知道看到了官方文档中的解释:

v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。

v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。

相比之下,v-show 就简单得多——不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。

一般来说,v-if 有更高的切换开销,而 v-show 有更高的初始渲染开销。因此,如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好。

vue-if和v-show区别的更多相关文章

  1. vue和react之间的区别

    1.Vue和React之间的区别 相同点: Vue和其他框架一样,都有组件开发和虚拟dom 都支持props进行父子组件之间的数据通信 都支持数据驱动视图,不直接操作真实dom 都支持服务器端的 渲染 ...

  2. vue $mount 和 el的区别

    两者在使用效果上没有任何区别,都是为了将实例化后的vue挂载到指定的dom元素中. 如果在实例化vue的时候指定el,则该vue将会渲染在此el对应的dom中,反之,若没有指定el,则vue实例会处于 ...

  3. vue中$mount与el区别

    vue中的$mount和el两者在使用中没有什么区别,都是将实例化后的vue挂载到指定的DOM元素中 用法: 如果在实例化vue时指定el,则该vue将会渲染在el对应的DOM中 反之 没有指定el, ...

  4. Vue.js和angular.js区别

    Vue.js:易学 简单 指令以v.xxx 一片HTML代码配合json,在new出来Vue,js实例 个人维护项目 适用于移动端 应用超越了angular angular.js:上手难 指令以ng. ...

  5. Vue路由钩子 afterEach beforeEach区别

    ​ vue-router作为vue里面最基础的服务,学习一段时间,对遇到的需求进行一些总结 使用vue-cli作为开发前提 vue-router已经配置好了 路由写法 routes: [ { path ...

  6. [转]v$parameter, v$parameter2, v$system_parameter, v$system_parameter2, v$spparameter区别

    本文转自:http://blog.csdn.net/huang_xw/article/details/617389 1 v$parameter v$parameter显示的是session级的参数. ...

  7. Vue 中computed 与 methods 区别

    1.示例 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF- ...

  8. vue、React Nactive的区别(转载)

    Vue与React的对比 Vue.js与React.js从某些反面来说很相似,通过两个框架的学习,有时候对一些用法会有一点思考,为加深学习的思索,特翻阅了两个文档,从以下各方面进行了对比,加深了对这两 ...

  9. Vue.mixin Vue.extend(Vue.component)的原理与区别

    1.本文将讲述 方法 Vue.extend Vue.mixin 与 new Vue({mixins:[], extend:{}})的区别与原理 先回顾一下 Vue.mixin 官网如下描述: Vue. ...

  10. vue jsx与render的区别及基本使用

    vue template语法简单明了,数据操作与视图分离,开发体验友好.但是在某些特定场合中,会限制一些功能的扩展,如动态使用过滤器.解析字符串类型的模板文件等.以上功能的实现可以借助vue的rend ...

随机推荐

  1. utf-8mb4和排序规则

    MySQL在5.5.3之后增加了这个utf8mb4的编码,mb4就是most bytes 4的意思,专门用来兼容四字节的unicode. 最新的 UTF-8 规范只使用一到四个字节,最大能编码21位, ...

  2. Intellij中部署Tomcat(详细版本-介绍了部署完之后的详细路径)

    https://blog.csdn.net/HughGilbert/article/details/56424137 要点如下: 1. CATALINA_HOME即Tomcat的安装目录 2. CAT ...

  3. unity的一些tips

    主要是我知乎上回答的一个关于unity的tip,备忘. 说说我所看到unity相关的,不好的习惯: 1 尽量不要在Awake(), start()等函数内加入业务逻辑的初始化代码.首先无法简便的直接启 ...

  4. springMVC配置文件web.xml与spring-servlet.xml与spring-jdbc.xml与logback.xml与redis.properties与pom.xml

    springMVC注解:@Controller @Service @Repository 分别标注于web层,service层,dao层. web.xml <?xml version=" ...

  5. Scrapy实战篇(一)之爬取链家网成交房源数据(上)

    今天,我们就以链家网南京地区为例,来学习爬取链家网的成交房源数据. 这里推荐使用火狐浏览器,并且安装firebug和firepath两款插件,你会发现,这两款插件会给我们后续的数据提取带来很大的方便. ...

  6. Nios II Host-Based File System

    Nios II Host-Based File System 允许运行在Nios II的程序,在Debug模式下,通过Altera download cable来读写PC上当前工程目录下(及其子目录) ...

  7. Linux运维人员最常用166个命令汇总

    引用自“菜鸟博客” 命令 功能说明 线上查询.帮助命令(2个) man 查看命令帮助,命令词典,更复杂还有info,但不常用. help 查看Linux内置命令的帮助,比如cd等命令. 文件.目录操作 ...

  8. Tomcat的目录结构详细介绍(超全)

    打开tomcat的解压之后的目录可以看到如下的目录结构:  1.bin: bin目录主要是用来存放tomcat的命令,主要有两大类,一类是以.sh结尾的(linux命令),另一类是以.bat结尾的(w ...

  9. [持续交付实践] pipeline使用:项目样例

    项目说明 本文将以一个微服务项目的具体pipeline样例进行脚本编写说明.一条完整的pipeline交付流水线通常会包括代码获取.单元测试.静态检查.打包部署.接口层测试.UI层测试.性能专项测试( ...

  10. 怎样让scrollview滚动到底部?

    - (void)scrollsToBottomAnimated:(BOOL)animated { CGFloat offset = self.tableView.contentSize.height ...