两者在使用效果上没有任何区别,都是为了将实例化后的vue挂载到指定的dom元素中。

如果在实例化vue的时候指定el,则该vue将会渲染在此el对应的dom中,反之,若没有指定el,则vue实例会处于一种“未挂载”的状态,此时可以通过$mount来手动执行挂载。

注:如果$mount没有提供参数,模板将被渲染为文档之外的的元素,并且你必须使用原生DOM API把它插入文档中。

例如:

var MyComponent = Vue.extend({
template: '<div>Hello!</div>'
}) // 创建并挂载到 #app (会替换 #app)
new MyComponent().$mount('#app') // 同上
new MyComponent({ el: '#app' }) // 或者,在文档之外渲染并且随后挂载
var component = new MyComponent().$mount()
document.getElementById('app').appendChild(component.$el)

vue $mount 和 el的区别的更多相关文章

  1. vue中$mount与el区别

    vue中的$mount和el两者在使用中没有什么区别,都是将实例化后的vue挂载到指定的DOM元素中 用法: 如果在实例化vue时指定el,则该vue将会渲染在el对应的DOM中 反之 没有指定el, ...

  2. vue 手动挂载$mount() 获取 $el

    手动挂载$mount() 如果没有挂载的话,没有关联的 DOM 元素.是获取不到$el的. https://vuejs.org/v2/api/#vm-mount var MyComponent = V ...

  3. 【转】vue 手动挂载$mount() 获取 $el

    原文:https://www.cnblogs.com/CyLee/p/8425183.html 手动挂载$mount() 如果没有挂载的话,没有关联的 DOM 元素.是获取不到$el的. https: ...

  4. docker的volume和bind mount究竟有什么区别?

    不知道你在使用docker的时候,有没有注意到volume mount和bind mount的使用? 进一步说,他们之间的区别到底是什么? 接下来的内容,我们就为你揭开他们的神秘面纱. 相同之处 首先 ...

  5. js/jstl/el的区别

    JavaScript 学习的路径:http://www.w3school.com.cn/js/js_intro.asp 是世界上最流行的编程语言. 这门语言可用于 HTML 和 web,更可广泛用于服 ...

  6. JSTL和EL的区别

    JSTL(JSP Standard Tag Library,JSP标准标签库)是一个不断完善的开放源代码的JSP标签库,是由apache的jakarta小组来维护的.JSTL只能运行在支持JSP1.2 ...

  7. JSTL与EL的区别

    JSTL JSTL(JSP Standard Tag Library,JSP标准标签库)是一个不断完善的开放源代码的JSP标签库,是由apache的jakarta小组来维护的.JSTL只能运行在支持J ...

  8. vue系列---理解Vue中的computed,watch,methods的区别及源码实现(六)

    _ 阅读目录 一. 理解Vue中的computed用法 二:computed 和 methods的区别? 三:Vue中的watch的用法 四:computed的基本原理及源码实现 回到顶部 一. 理解 ...

  9. JSTL标签,EL表达式,OGNL表达式,struts2标签 汇总

    一下纯属个人总结摘抄,总结一起方便查看,解决疑问,有遗漏或错误,还请指出.       1,JSTL标签总结: a).JSTL标签有什么用?          JSTL是由JCP(Java Commu ...

随机推荐

  1. mariadb:SQL日常使用总结

    1.关联删除 DELETE T_Base_Resource_Action FROM T_Base_Resource_Action  INNER JOIN T_Base_Resource ON T_Ba ...

  2. 【原创】大数据基础之Hadoop(2)hdfs和yarn最简绿色部署

    环境:3结点集群 192.168.0.1192.168.0.2192.168.0.3 1 配置root用户服务期间免密登录 参考:https://www.cnblogs.com/barneywill/ ...

  3. 安装snap及snap常安装软件

    文章链接:https://blog.csdn.net/laomd/article/details/80710451 一.snap简介 什么是snap,snap是一种全新的软件包管理方式,它类似一个容器 ...

  4. iOS10 远程通知需要有entitlements的支持

    今天测试远程通知,发现ios9上可以收到,但是ios10上无法收到,原来是忘记开下面这个选项了: 这样看来iOS9 对这个entitlement没有什么依赖,但是10却是必须打开的!

  5. JAVA框架之Hibernate框架的学习步骤

    首先介绍一下Java三大框架的关系 以CRM项目即客户关系管理项目示例 hibernate框架的学习路线: 1.学习框架入门,自己搭建框架,完成增删改查的操作 2.学习一级缓存,事物管理和基本查询 3 ...

  6. Confluence 6 安装补丁类文件

    Atlassian 支持或者 Atlassian 缺陷修复小组可能针对有一些关键问题会提供补丁来解决这些问题,但是这些问题还没有放到下一个更新版本中.这些问题将会使用 Class 类文件同时在官方 J ...

  7. Confluence 6 MySQL 数据库设置准备

    请查看 Supported Platforms 页面来获得 Confluence 系统支持的 MySQL 数据库版本.你需要在安装 Confluence 之前升级你的 MySQL 数据库. 如果你从其 ...

  8. 【CSS】Bootstrap中select2+popover冲突

    网上搜索得到: It changes the position because the position is based on the popover's dimansions and select ...

  9. python之通过thread来实现多进程

    代码如下: import threading, time class Test1(threading.Thread): def __init__(self, name): super().__init ...

  10. JPA环境配置

    JPA概述 JPA(Java Persistence API)的简称,用于持久化的API. JAVAEE5.0平台标准的ORM的规范使得应用程序以统一的方式访问持久层. JPA和Hibernate的关 ...