挂载点：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. VC++ 2010 创建高级Ribbon界面详解(3)

    3.工具栏 在传统的菜单式界面中,工具栏作为菜单的有益补充,被广泛使用.我们通过将一些常用命令放置到工具栏上,可以让用户直观而快速地访问到常用功能,提高了效率.在Ribbon界面中,工具栏得到了进一步 ...

  2. 20140506 visio 画布大小 栈实现队列 堆空闲内存地址链表 堆最大可分配的内存 可用内存链表

    1.调整visio的画布大小 按住Ctrl鼠标移动到画布边缘即可 2.两个栈实现一个队列 一个栈用于入队,一个用于出队 #include<iostream> #include<sta ...

  3. leetcode.字符串.5最长回文子串-Java

    1. 具体题目 给定一个字符串 s,找到 s 中最长的回文子串.你可以假设 s 的最大长度为 1000. 示例 1: 输入: "babad" 输出: "bab" ...

  4. MySQL在win10以及linux下数据库的备份以及还原

    MySQL在win环境或者linux下的命令都是一样的,只是路径不一致而已 MySQL的备份 (非必须)命令行进入MySQL的bin目录 输入命令:mysqldump -u userName -p d ...

  5. mongo数组修改器—$push、$ne、$addtoset、$pop、$pull

    这几个方法也很有意思 $push 像已有的数组末尾加入一个元素,要是元素不存在,就会创建一个新的元素,如果元素存在了,就会再添加一个一模一样的元素,会造成元素的重复,所以在使用的时候,要确保该元素不存 ...

  6. debug breakpoint with maven in eclipse

  7. zdump - 时区输出器

    SYNOPSIS 总览 zdump [ -v ] [ -c cutoffyear ] [ zonename ... ] 描述 Zdump 对命令行中的每一个 zonename 输出其当前时间. 提供了 ...

  8. 从零开始搭搭建系统3.1——顶级pom制定

    从零开始搭搭建系统3.1——顶级pom制定

  9. docker启动elasticsearch异常Failed to create node environment（解决）

    异常说是创建节点环境失败,操作/usr/share/elasticsearch/data/nodes的IO错误,尝试给此目录添加读写权限后,依旧没什么**用,灵机一动是不是挂载目录没有权限导致的? c ...

  10. leetcode-159周赛-5231-删除子文件夹

    题目描述: 自己的提交: class Solution: def removeSubfolders(self, folder: List[str]) -> List[str]: d = {} r ...