两者在使用效果上没有任何区别,都是为了将实例化后的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. OpenStack实践系列⑨云硬盘服务Cinder

    OpenStack实践系列⑨云硬盘服务Cinder八.cinder8.1存储的三大分类 块存储:硬盘,磁盘阵列DAS,SAN存储 文件存储:nfs,GluserFS,Ceph(PB级分布式文件系统), ...

  2. Kafka中文官方文档

    参见链接:http://orchome.com/kafka/index

  3. Linux平台 Oracle 18c RAC安装

    Linux平台 Oracle 18c RAC安装Part1:准备工作 2018-08-04 22:20 by AlfredZhao, 1065 阅读, 0 评论, 收藏, 编辑 一.实施前期准备工作 ...

  4. JS知识点随笔

    1.为什么 0.1 + 0.2 != 0.3? 原因: 因为 JS 采用 IEEE 754 双精度版本(64位),并且只要采用 IEEE 754 的语言都有该问题. 我们都知道计算机是通过二进制来存储 ...

  5. java常见命名规则

    常见命名规则: 包:类似文件夹,用于把相同的类名进行区分(小写) 单级:例如:student 多级:例如:cn.student 类或者接口: 一个单词:单词首字母大写,例如:Student 多个单词: ...

  6. Confluence 6 Oracle 测试你的数据库连接

    在你的数据库设置界面,有一个 测试连接(Test connection)按钮可以检查: Confluence 可以连接你的数据库服务器 数据库的字符集编码是否正确 你的数据库用户是否具有需要的权限 你 ...

  7. Confluence 6 当前使用的数据库状态

    进入  > 基本配置(General Configuration) > 问题检查和支持工具(Troubleshooting and support tools) 你就可以看到当前使用的数据 ...

  8. Linux文件压缩与打包笔记

    linux 文件压缩与打包笔记 压缩原理:通过算法去掉空位,1Bytes=8bits , 可能存储的真正有用的数据并没有占满一个字节空间 , 还有就是可能有重复的数据,通过某种算法从这些方面进行压缩处 ...

  9. Python实战一

    要求:用户输入用户名和密码错误三次,就对该用户进行锁定,不让其进行登录. def match(name,pwd): '''匹配用户输入的信息,进行判断''' falg = True while fal ...

  10. html 基本指令

    命令: <pre> </pre> 格式化输出 <ol></ol> 有序 HTML 列表:示例: <pre> here is outout & ...