vue中的el是指什么简写

vue中,el是element的缩写,可称之为挂载点。el的作用是提供一个在页面上已存在的DOM元素作为Vue实例的挂载目标,可以是CSS选择器,也可以是一个HTMLElement实例;在实例挂载之后,元素可以用“vm.$el”访问。

vue中的el是指什么简写

本教程操作环境:windows7系统、vue3版,DELL G3电脑。

el是element的缩写,可称之为挂载点。原理来自于:MVC架构中,使用一个标签当做容器包住一些标签,使得标签被重新渲染,同时保留一些必要的属性。

每个vue2.0项目中我们都会看到入口文件(即main.js)中,在生成根实例时会配置el属性,而我们自己创建的组件中则不能配置该属性,下面引用了官方文档中对el属性的说明:

el

类型:string | Element

立即学习“前端免费学习笔记(深入)”;

限制:只在用 new 创建实例时生效。

详细

提供一个在页面上已存在的 DOM 元素作为 Vue 实例的挂载目标。可以是 CSS 选择器,也可以是一个 HTMLElement 实例。【相关推荐:官方文档、官方文档】

在实例挂载之后,元素可以用 vm.$el 访问。

如果在实例化时存在这个选项,实例将立即进入编译过程,否则,需要显式调用 vm.$mount() 手动开启编译。

简单来说el的作用就是表明我们要将当前vue组件生成的实例插入到页面的哪个元素中,el属性的值可以是css选择器的字符串,或者直接就是对应的元素对象。并且只能在使用new生成实例时才能配置el属性,而我们在组件中只是export一个配置对象,如果设置了el则会报错。

// 错误使用方式,在组件中设置el// 提示错误: [Vue warn]: option "el" can only be used during instance creation with the `new` keyword.export default {    el: '#app'} // 正确写法var vm = new Vue({    el: '#app'})

登录后复制

我们再看看项目中的index.html。

              backstage            

登录后复制

打印vm.$el,会发现实例已经被挂载到el对于的元素中:

vue中的el是指什么简写

(学习视频分享:官方文档、官方文档)

以上就是vue中的el是指什么简写的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2924238.html

(0)
上一篇 2025年3月11日 18:55:03
下一篇 2025年3月6日 18:17:06

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • vue中mixin和组件的区别是什么

    mixin和组件的区别:组件在引用之后相当于在父组件内开辟了一块单独的空间,来根据父组件props过来的值进行相应的操作,单本质上两者还是泾渭分明,相对独立;而mixins在引入组件之后相当于父组件的各种属性方法都被扩充了,会将组件内部的内…

    2025年3月11日
    200
  • vue页面渲染是同步还是异步

    vue页面渲染是异步的。vue采用的是异步渲染,这样可以提升性能;如果不采用异步更新,在每次更新数据都会对当前组件进行重新渲染,为了性能考虑,Vue会在本轮数据更新后,再去异步更新视图。 本教程操作环境:windows7系统、vue3版,D…

    2025年3月11日
    200
  • vue移动端用什么框架

    vue移动端框架有:1、Vant,基于有赞统一的规范实现的Vue组件库;2、Mint UI,是一个vue移动端组件库;3、Wot Design;4、NutUI;5、JDDUI;6、vux;7、vonic;8、Muse-UI;9、Cube-U…

    2025年3月11日 编程技术
    200
  • vue的$refs是什么意思

    在vue中,$refs是一个对象,持有注册过ref attribute的所有DOM元素和组件实例。ref被用来给元素或子组件注册引用信息,引用信息将会注册在父组件的“$refs”对象上;如果在普通的DOM元素上使用,引用指向的就是DOM元素…

    2025年3月11日
    200
  • vue 对象的侦听属性用什么表示

    vue对象的侦听属性用“watch”表示。所谓监听就是对内置对象的状态或者属性变化进行监听并且做出反应的响应,监听属性,意思就是可以监视其他数据的变化。vue中监听属性有两种写法:1、在“new Vue()”中传入watch配置;2、通过“…

    2025年3月11日
    200
  • vue中v-bind有什么用

    在vue中,v-bind指令主要用于属性绑定,完整语法“v-bind:property=”value””,缩写语法“:href=”value””;表明将该属性的属性值当成一个变量,vue会对它…

    2025年3月11日 编程技术
    200
  • vue中隐藏元素的指令是什么

    vue中隐藏元素的指令是“v-show”。v-show指令根据表达式的真假,来决定一个元素显示或者隐藏,语法为“v-show=”表达式””。v-show指令是通过改变元素的css display属性来控制元素的显示和…

    2025年3月11日
    200
  • vue的导航钩子有哪几个

    vue的导航钩子有3种:1、全局守卫钩子,是指路由示例上直接操作的钩子函数,特点是所有路由配置的组件都会触发。2、路由独享守卫钩子,是指在单个路由配置的时候也可以设置的钩子函数,且只能在这个路由下起作用。3、局部守卫钩子,是指在组件内执行的…

    2025年3月11日
    200
  • vscode写vue没有高亮语法怎么办

    解决方法:1、打开vscode,点击扩展功能;2、在打开的窗口中搜索并安装Vetur插件;3、在顶部菜单中,依次点击“文件”-“首选项”-“设置”-“用户”-“文本编辑器”,找到并编辑“setting.json”文件;4、在配置文件中找到“…

    2025年3月11日 编程技术
    200
  • 移动web开发能用vue吗

    移动web开发能用vue。Vue是一个开源JavaScript框架,能够开发单页面应用程序;它可以用作Web应用程序框架,旨在简化Web开发。vue支持移动端开发,适合制作移动端的Webapp;其入门成本低、快速上手,可以结合i-view、…

    2025年3月11日 编程技术
    200

发表回复

登录后才能评论