越来越感觉,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. OpenCV尝试

    我们来尝试,使用OpenCV来读入本地的一张图片,并使用库函数将其水平翻转.垂直翻转以及边缘提取,后将结果文件存入本地. 工具:VS2017  OpenCV4.0.1 怎么配置opencv/报错怎么办 ...

  2. 升级Mac OS X上的git

    今天一打开visual studio code就提示我git版本low,需要升级,然后提供了一个下载链接(git官方下载地址:https://git-scm.com/),然后我就根据链接去下载了mac ...

  3. char在C语言一个字节表示的数据范围

    #include <stdio.h> //char类型数据范围 [-128,127] // ......-132 -131 -130 -129 -128 .. 127 128 129 13 ...

  4. July 12th, 2018. Thursday, Week 28th.

    People love what other people are passionate about. 人总是会爱上别人倾注热情的事物. From La La Land. This quote has ...

  5. C#中,三种强制类型转换的对比

    在C#中,我们可以看到三种强制类型转换,比如强制转换成有符号32位整型,可以找到下面三种方式: ① (int)()                ②Convert.ToInt32()          ...

  6. 初窥css---盒子以及盒子扩展

    盒子以及盒子扩展 盒子 盒子是用来实现将网页区域化的一个非常重要的工具,盒子使得网页各部分十分清晰的被分开,对于程序员十分友好(...),并且使得网页更加容易维护. 盒子的常用属性 宽和高这两个属性就 ...

  7. springboot 实现配置文件给常量赋值

    @Component @ConfigurationProperties(prefix = "task.cron") public class TaskCronParam imple ...

  8. springfox-swagger之swagger-bootstrap-ui

    swagger-bootstrap-ui是国内的一个swagger开源项目,从发起到现在已经有三年了.初次体验了一下,觉得还是挺不错的,就如当初使用mybatis-plus那样,因为有了mybatis ...

  9. 浅谈 C# SQL防注入

    1#region 防止sql注入式攻击(可用于UI层控制)  2  3///   4/// 判断字符串中是否有SQL攻击代码  5///   6/// 传入用户提交数据  7/// true-安全:f ...

  10. Vue 2.6版本基础知识概要(一)

    挂载组件 //将 App组件挂载到div#app节点里 new Vue({ render: h => h(App), }).$mount('#app') VueComponent.$mount ...