挂载点：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. Array.prototype.slice.call()等几种将arguments对象转换成数组对象的方法

    网站搬迁,给你带来的不便敬请谅解! http://www.suanliutudousi.com/2017/10/10/array-prototype-slice-call%E7%AD%89%E5%87 ...

  2. 数据整理B

  3. <Linux>Linux基础学习（兄弟连版本）

    1.Linux系统简介 1.1 Unix与Linux发展史 父子关系:Unix 是Linux的前身 1969年,肯丶汤姆森开发Unix系统(为了加快玩游戏的速度 - -,自己开发的系统) 1971年, ...

  4. EtherCat开源主站SOEM在windows下工程配置

    截至2019年1月,虽然github上有1.3.3的更新,但是用的人估计还不多,而且1.3.2被官方认为bug严重弃用.所以还是学习1.3.1. 1.拷贝osal.oshw.soem.lib(已生成l ...

  5. VS项目种类GUID

    在VS里新建的类库项目,在添加新建项时往往找不到模板.比如想新建一个WPF的资源词典文件,VS认为该类库项目不是WPF类型,就没有列出新建资源词典的模板.解决办法是在csproj文件的<Prop ...

  6. mui框架开发aop的跨页面传值

    mui开发跨平台app,其实不乏会涉及到跨页面传值,今天给大家简单介绍一种常用也是简单的传值方法 咱在这里设置一个场景,就是两个页面进入到同一页面展示不同的元素,此时需要在这两个页面各自设置一个区别的 ...

  7. delphi 判断两个时间差是否在一个指定范围内

    WithinPastYears.WithinPastMonths.WithinPastWeeks.WithinPastDays ... 判断两个时间差是否在一个指定范围内DateUtils.Withi ...

  8. Maven将本地项目打包后引入本地另一个项目

    进入需要打包的文件夹,执行:mvn clean install -X 生成JAR包 打完JAR包后,将maven依赖安装 执行命令: install:install-file -Dfile=E:\co ...

  9. sqoop简介和原理分析

    Sqoop简介 Sqoop是一款开源的工具,主要用于在Hadoop(Hive)与传统的数据库(mysql.postgresql...)间进行数据的传递,可以将一个关系型数据库(例如 : MySQL , ...

  10. ES,kibana通过nginx添加访问权限

    一.安装nginx yum install epel-release -y yum install -y nginx 二.安装Apache Httpd 密码生成工具 # 生成密码 yum instal ...