美文网首页
Vue.js 记录1

Vue.js 记录1

作者: 李奕锦liyijin | 来源:发表于2019-06-27 17:32 被阅读0次

最近学习VUE框架,记录一下。

1. vue devtools not work

解决方法

重启浏览器

image.png
2.v-if vs v-show

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

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

例子:

条件为真

image.png

条件为假


image.png

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

条件为真


image.png

条件为假


image.png

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

相关文章

  • Vue.js 记录1

    最近学习VUE框架,记录一下。 1. vue devtools not work 解决方法 重启浏览器 2.v-i...

  • Vue脚手架优化

    记录脚手架搭建之后一些优化,包括结构、代码、易用性 1 vue.js 引用组件方式优化 vue.js 引用组件需要...

  • 2019-06-15

    Node.js、Vue.js 运行环境搭建记录 参考链接:Vue.js 运行环境搭建详解(基于windows的手把...

  • Vue.js基础

    1 vue.js研究 1.1 vue.js介绍 1、vue.js是什么?Vue (读音 /vjuː/,类似于 vi...

  • Vue——初始Vue & Vue的响应式原理 & Vue常用指令

    一、初始Vue 1、准备一个容器 2、引入vue.js文件 方式(1)引入本地vue.js文件 vue.js文件官...

  • 一.Vue.js起步

    1 Vue.js Vue.js官网 Vue.js菜鸟教程 2 MVVM模式 MVC:Model-Viel-Cont...

  • Vue.js 第一天

    Vue.js 一、Vue.js简介 1.Vue.js 是什么 vue.js 也称为Vue,读音 /vju:/ ,类...

  • Vue 循环、点击、双向绑定

    一、了解 Vue.js 1 Vue.js是什么? Vue.js是一套用于构建用户界面的渐进式框架。Vue.js通过...

  • Vue入门-Webpack入门-CMS页面查询开发

    1. vue.js研究 1.1 vue.js介绍 vue.js是什么? Vue (读音 /vjuː/,类似于 vi...

  • Vue起步

    Vue.js官网 Vue.js教程 1. Vue.js起步 Vue.js有两种方式:引入CDN方式或使用命令行工具...

网友评论

      本文标题:Vue.js 记录1

      本文链接:https://www.haomeiwen.com/subject/bczrcctx.html