越来越感觉,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. Android 使用TextView实现跑马灯效果

    前言 我们在开发中经常会遇到一个小问题.比如下面一个小例子: 这个文字太长,单行中导致无法全部显示出来,这就是今天要实现的功能. 当然,百度中也有很多这种解决方案. 其中有一种,例如: <Tex ...

  2. django mongodb配置

    #settings.py import os from mongoengine import * BASE_DIR = os.path.dirname(os.path.dirname(os.path. ...

  3. Docker-通过docker-maven-plugin插件实现docker镜像构建并自动发布到远程docker服务器

    我们知道,docker能实现应用打包隔离,实现快速部署和迁移.如果我们开发应用使用了spring cloud + spring boot架构,那么,通过docker-maven-plugin实现快速构 ...

  4. js坚持不懈之11:focus()方法

    主要是用于获取焦点,自动把光标放到此组件上面,无须用户再次操作. 示例: <html> <head> <p>1. 长度限制</p> <form n ...

  5. 初步了解PE分析

    尝试编写代码获取PE文件的信息. 首先使用 CreateFile打开一个PE文件并返回一个用于访问该对象的handle. HANDLE CreateFile( LPCTSTR lpFileName, ...

  6. idea中Springcloud同时运行多个模块、微服务

    idea中有个窗口叫做 Run DashBoard 在这里可以管理多个模块的启停,这个面板一般情况下是关闭的打开Run DashBoard面板 在工程的.idea中找到workspace.xml,并找 ...

  7. 随机排序std::vector,扑克牌,麻将类尤其合用

    有些需要重新对std::vector对象重新排序,特别是游戏,例如说:扑克牌,麻将,抽奖等,C++标准已经为std::vector写好了随机排序的方式,这里做个笔记: #include <alg ...

  8. 元数据Metadata

    元数据是什么? 元数据(Metadata),又称中介数据.中继数据,为描述数据的数据(data about data),主要是描述数据属性(property)的信息,用来支持如指示存储位置.历史数据. ...

  9. 【spring源码分析】IOC容器初始化(七)

    前言:在[spring源码分析]IOC容器初始化(六)中分析了从单例缓存中加载bean对象,由于篇幅原因其核心函数 FactoryBeanRegistrySupport#getObjectFromFa ...

  10. Binwalk的安装和使用

    Binwalk的安装和使用 一.安装Git 参考链接:https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067 ...