<body>
  <div id='root'>
    <h1>{{msg}}</h1>
  </div>
  <script>
    new Vue({
      el:'#root',
      data:{
        msg:'hello world'
      }
    })
  </script>
</body>

挂载点:element对应的标签

上面的html中{{msg}}去掉
<div id='root'></div>
这个标签就称之为vue实例的挂载点,因为下面的el,也就是element正好与上面的标签的id对应的上
 
 
模板:挂载点内部的内容
<h1>{{msg}}</h1>
这个就是模板,模板也可以有多种方式
new Vue({
  el:'#root',
  template:'<h1>{{msg}}</h1>',
  data:{
    msg:'hello world'
  }
})

这种写在实例里面也可以,所以模板就是挂载点内部的内容,模板可以写在挂载点内部,也可以写在实例里面template属性里面

vuejs挂载点,模板与实例的关系的更多相关文章

  1. vue入门之创建第一个实例,挂载点、模板和实例之间的关系

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 03: vuejs 事件、模板、过滤器

    目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 03: vuejs 事件.模板.过滤器 目录: 1.1 事件 1.2 模板 1.3 自定义过滤器 1.4 过度 1.5 支付 ...

  3. JavaScript 闭包环境非常奇特 - 相当于类与实例的关系?!

    JavaScript 闭包环境非常奇特 - 相当于类与实例的关系?! 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一 ...

  4. m_Orchestrate learning system---三十一、模板和需求的关系

    m_Orchestrate learning system---三十一.模板和需求的关系 一.总结 一句话总结:模板为了适应广大用户,有很多功能样式,但是,你需要的只是部分,所以删掉不需要的,如果有需 ...

  5. Java推断类和实例的关系

       通常我们使用instanceOf关键字来推断一个对象是否是类的实例,近期博主看到isInstance关键字,不解与instanceOf的差别,故度娘了一下,顺便涨了一下姿势.    Java中推 ...

  6. Javascript原型、构造函数、实例的关系

    1. 原型.构造函数.实例的关系 原型: 原型通过constructor指向构造函数,原型如果是自定义对象且没有明确将constructor指向构造函数,则原型的constructor指向函数的基类F ...

  7. vue入门 0 小demo (挂载点、模板、实例)

    vue入门 0 小demo  (挂载点.模板) 用直接的引用vue.js 首先 讲几个基本的概念 1.挂载点即el:vue 实例化时 元素挂靠的地方. 2.模板 即template:vue 实例化时挂 ...

  8. VBA嘘嘘嘘(1)——将Excel数据填入到已存在的Word模板表格(实例应用)

    傻瓜可以写出机器读懂得代码,但写出让人能读懂的代码的是优秀程序员 Sub 填充() Application.ScreenUpdating = False 'ScreenUpdating 是控制你的ex ...

  9. JavaScript模板引擎实例应用

    在之前的一篇名为<移动端基于HTML模板和JSON数据的JavaScript交互>的文章中,我向大家说明了为什么要使用JavaScript模板以及如何使用,文末还提到了laytpl.art ...

随机推荐

  1. HDFS(Hadoop Distributed File System )hadoop分布式文件系统。

    HDFS(Hadoop Distributed File System )hadoop分布式文件系统.HDFS有如下特点:保存多个副本,且提供容错机制,副本丢失或宕机自动恢复.默认存3份.运行在廉价的 ...

  2. Retina显示屏-揭秘移动端的视觉稿通常会设计为传统PC的2倍

    一.Retina显示屏简介 retina:一种具备超高像素密度的液晶屏,同样大小的屏幕上显示的像素点由1个变为多个,如在同样带下的屏幕上,苹果设备的retina显示屏中,像素点1个变为4个. reti ...

  3. 《SQL 进阶教程》 自连接排序

    子查询所做的,是计算出价格比自己高的记录的条数并将其作为自己的位次 -- 自连接实现排序功能SELECT P1.name,P1.price,(SELECT COUNT(P2.price)FROM Pr ...

  4. Python网络爬虫(一)

    Urllib发送请求 基本用法 基本的用法就是调用request库, class urllib.request.Request(url, data=None, headers={}, origin_r ...

  5. PHPExcel探索之旅---阶段一

    类似于Java,php也有操作Excel的方法,其中需要下载PHPExcel插件,将其中的Classes文件夹改名为PHPExcel并提取到根文件夹外面,将两个文件夹一起放在所需项目中 使用PHPEx ...

  6. 1093 Count PAT's(25 分)

    The string APPAPT contains two PAT's as substrings. The first one is formed by the 2nd, the 4th, and ...

  7. remote error: You can't push to git 解决办法

  8. Java面向对象_常用类库api——对象比较器

    概念:对两个或多个数据项进行比较,以确定他们是否相等,或确定他们之间的大小关系及排列顺序成为比较. 1.Comparable接口: 此接口强行对实现它的每个类的对象进行整体排序.这种排序被称为类的自然 ...

  9. (转)Linux之split命令详解

    Linux之split命令详解 原文:http://m.jb51.net/article/73632.htm Linux split命令用于将一个文件分割成数个,该指令将大文件分割成较小的文件,在默认 ...

  10. python学习二(文件与异常)

    Python中使用open BIF与文件交互,与for语句结合使用,一次读取一行 读取文件sketch.txt,文件内容如下: Man: Ah! (taking out his wallet and ...