越来越感觉，Vue学起来很有意思

v-cloak：解决插值表达式闪烁问题

先来写一个HTML，如下

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Vae</title>

</head>

<body>

    <!-- 这个div就是MVVM中的V，View -->

    <div id="app">

        <p>{{ msg }}</p>

    </div>

    <script type="text/javascript" src="../lib/vue-2.6.10.js"></script>

    <script>

        // 这个vm就是MVVM中的VM，ViewModel

        var vm=new Vue({

         el: '#app',

        //  这个data就是MVVM中的M，Model

         data: {

            msg: '许嵩'

            }

        })

    </script>

</body>

</html>

可以看到，我把Vue.js的引用放到div下面了，这样是为了更好的重现插值表达式闪烁的情况。

安装插件Live Server

我要模拟网络环境，本地肯定不行，所以我们下载安装一个插件Live Server

看这个插件的开发者化的括号和箭头我就知道，这是一个有趣的人

Vue学习笔记二：v-cloak，v-text，v-html的使用的更多相关文章

  1. vue学习笔记(二)vue的生命周期和钩子函数

    前言 通过上一章的学习,我们已经初步的了解了vue到底是什么东西,可以干什么,而这一篇博客主要介绍vue的生命周期和它常用的钩子函数,如果有学过java的园友可能有接触到在学习servlet的时候学过 ...

  2. VUE 学习笔记 二 生命周期

    1.除了数据属性,Vue 实例还暴露了一些有用的实例属性与方法.它们都有前缀 $,以便与用户定义的属性区分开来 var data = { a: 1 } var vm = new Vue({ el: ' ...

  3. VUE学习笔记二

    package.json不可以写注释!!!!!!!!!!初始化:npm init -y 有时候使用 npm i node-sass -D 装不上,这时候,就必须使用  cnpm i node-sass ...

  4. vue学习笔记二：v-if和v-show的区别

    v-if vs v-show v-if 是“真正的”条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建. v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做—— ...

  5. vue学习笔记(三)class和style绑定

    前言 通过上一章的学习vue学习笔记(二)vue的生命周期和钩子函数,我们已经更近一步的知道了关于vue的一些知识,本篇博客将进一步探讨vue其它方面的内容,vue中关于class和style绑定,关 ...

  6. Vue学习笔记-Vue.js-2.X 学习(二)===>组件化开发

    ===重点重点开始 ========================== (三) 组件化开发 1.创建组件构造器: Vue.extends() 2.注册组件: Vue.component() 3.使用 ...

  7. vue 学习笔记（二）

    最近公司赶项目,一直也没时间看 vue,之前看下的都快忘得差不多了.哈哈哈,来一起回顾一下vue 学习笔记(一)后,继续向下看嘛. #表单输入绑定 基础用法 v-model 会忽略所有表单元素的 va ...

  8. Vue学习笔记十三：Vue+Bootstrap+vue-resource从接口获取数据库数据

    目录 前言 SpringBoot提供后端接口 Entity类 JPA操作接口 配置文件 数据库表自动映射,添加数据 写提供数据的接口 跨域问题 前端修改 效果图 待续 前言 Vue学习笔记九的列表案例 ...

  9. Vue学习笔记-Vue.js-2.X 学习(一)===>基本知识学习

    一  使用环境: windows 7 64位操作系统 二  IDE:VSCode/PyCharm 三  Vue.js官网: https://cn.vuejs.org/ 四  下载安装引用 方式1:直接 ...

随机推荐

  1. 浅谈AndroidGPU过度绘制、GPU呈现模式分析及相关优化

    在真机设备下有一个开发者选项,这个大家都知道,我们最常用的就打开'USB调试'功能,方便真机调试. 在这开发者选项中还有个选项,'调试GPU过度绘制' 这里选择第二个选项'显示过度绘制区域' 可以看到 ...

  2. 使用PDF.JS实现pdf文件在线预览时，报文件被损坏的错误

    首先大概说明一下问题出现的背景:我用PDF.JS实现文件在线预览,参考网上的办法,在jsp文件中使用 <iframe src="<c:url value="js/gen ...

  3. (办公)mybatis工作中常见的问题(不定时更新)

    1.mybatis的like查询的方式. <if test="shopName != null and shopName != ''"> <bind name=& ...

  4. shell编程企业级实战

    如何才能学好Shell编程 为什么要学习shell编程 Shell是Linux底层核心 Linux运维工作常用工具 自动化运维必备基础课程 学好shell编程所需Linux基础 熟练使用vim编辑器 ...

  5. css浮动学习

    以前网页中的局都是使用浮动来实现的(毕竟ie9也不支持flex-box).而浮动在css中是一个挺难理解的概念,这次再巩固一下,float的具体使用事项. 1.行内元素和块元素的区别? 行内元素(im ...

  6. 佳文赏析：How to uninstall Linux

    来源:https://www.dedoimedo.com/computers/linux-uninstall.html This article was suggested to me by a re ...

  7. Url校验正则

    最近需要对HTTP请求合法性做一些校验,在网上查找了一些关于URL合法性的正则表达式. 在github上的有个关于weburl匹配的gist: https://gist.github.com/dper ...

  8. DAY20、垃圾回收机制，正则模块

    一.垃圾回收机制1.不能被程序访问到的数据,就称之为垃圾2.引用计数:每一次对值地址的引用都可以使该值得引用计数加1 每一次对值地址的释放都可以使该值得引用计数减一 当一个值的引用计数为0时,该值就会 ...

  9. 初探kafka streams

    1.启动zookeeper zkServer.cmd 2.启动kafka kafka-server-start.bat d:\soft\tool\Kafka\kafka_2.12-2.1.0\conf ...

  10. C++编程音视频库ffmpeg的pts时间换算方法

    ffmpeg中的pts,dts,duration时间记录都是基于timebase换算,我们主要分析下pts的时间怎么换算,其它的是一样的换算.ffmpeg的时间换算对许多新接触同学算是一个大坑,很多刚 ...