挂载点：vue实例 里面的el属性 对应的 id 所在的dom节点

模板：指的是挂载点内部的内容
          模板可以写在挂载点内部
          也可以写在属性里面

demo

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>vue入门</title>

    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>

</head>

<body>

  <div id="first">

  </div>

  <script>

      new  Vue({

        //绑定上面的id el指的是vue实例跟哪个dom节点绑定

        el:"#first",

        template:'<h1>hello{{msg}}</h1>',

        data:{

          msg:"world"

        }

      })

  </script>

</body>

</html>

　效果：

　

2018-05-01    11:20:11

vue 挂载点 实例 模板的更多相关文章

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

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

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

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

  3. vue学习笔记 实例（二）

    var data = {a: 1} var vm = new Vue({ el: '#example', data: data, created: function () { // `this` 指向 ...

  4. Vue 介绍,优点,实例

    一 认识vue 1.什么是vue 以数据驱动的web渐进式框架 三大主流框架: Angular React Vue 设计模式:MVVM 2.vue优点 - 以数据驱动,不直接操作DOM,效率高- 单页 ...

  5. Vue简单基础 + 实例 及 组件通信

    vue的双向绑定原理:Object.defineProperty() vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...

  6. Vue组件开发实例（详细注释）

    Vue组件开发实例: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...

  7. 浅谈Vue下的components模板

    浅谈Vue下的components模板在我们越来越深入Vue时,我们会发现我们对HTML代码的工程量会越来越少,今天我们来谈谈Vue下的 components模板的 初步使用方法与 应用 我们先来简单 ...

  8. 用Vue-cli生成vue+webpack的项目模板怎么设置为vue1.0版本？

    用Vue-cli生成vue+webpack的项目模板 $ npm install -g vue-cli $ vue init webpack my-project $ cd my-project $ ...

  9. vue四、实例

    1.new Vue创建根实例 2.data对象,所有的属性加入到 Vue 响应式系统-值发生改变时,视图自动变更为新值 只有实例被创建时存在的属性才会响应式改变,后增加的不会 vue定义的实例属性和方 ...

随机推荐

  1. 利用JFileChooser实现文件选择对话框

    简单的文件选择对话框: package mypackage;/** * 打开文件和存储文件 */import java.awt.BorderLayout;import java.awt.Contain ...

  2. Summary 报告

    1.需要在添加一个名为summary report的监听器,跑完之后查看 Label:取样器/监听器名称 Samples :事务数量 Average:平均一个完成一个事务消耗的时间(平均响应时间) M ...

  3. PWM,SBUS,PPM信号转模拟电压的方案

    PWM,SBUS,PPM信号转模拟电压的方案 -----------------本文由"麦粒电子"撰写,并提供相应产品服务.---------------- 案例场景 有个内部采用 ...

  4. mongodb java操作常用写法

    MongoDB 将数据存储为一个文档,数据结构由键值(key=>value)对组成.MongoDB 文档类似于 JSON 对象.字段值可以包含其他文档,数组及文档数组.下面介绍的是用java操作 ...

  5. 笔记46 Hibernate快速入门（三）

    Hibernate相关概念 一.事物概念 Hibernate的任何对数据有改动的操作,都应该被放在事务里面. hibernate中的事务由s.beginTransaction();开始由s.getTr ...

  6. redis主从和集群搭建

    主从搭建 redis的主从搭建非常简单,打开配置文件6379.conf,只需要将主节点的protected-mode设置为no,然后在从节点配置中加入:slaveof <masterip> ...

  7. C中为什么不能用==比较字符串？

    通常的回答是,==比较的不是字符串的内容,它是在比较指针.或者说,==(或者!=)仅比较两个字符串的首地址,而不会比较字符串每个字符. 那其实接下来应该问的问题是,为什么会只比较首地址呢? 因为早期的 ...

  8. scala中函数简单使用记录

    object funcHighLevel { def main(args: Array[String]): Unit = { // 创建一个匿名函数 val sayFunc = (name: Stri ...

  9. Dart编程数字Number

    Dart数字可以分为: int - 任意大小的整数. int 数据类型用于表示整数. double -64位(双精度)浮点数,由IEEE 754标准规定. 在 double 数据类型用于表示小数 in ...

  10. cucumber：extentreports集成报告

    extentreports 测试报告 只支持java..Net 先在pom.xml文件中加入包引用 <!-- report--> <dependency> <groupI ...