What does el mean in vue.js-Vue.js-php.cn

What does el mean in vue.js

coldplay.xixi

Release： 2020-11-17 15:28:46

Original

8503 people have browsed it

The meaning of el in vue.js: The type of el is [String | HTMLElement | Function], which is used to provide mounting elements for instances. If there is a render function or template attribute, the mounting element will be Vue generated DOM replacement.

What does el mean in vue.js

[Related article recommendations: vue.js]

in vue.js el means:

Type: String | HTMLElement | Function

Restrictions: Can only be functions in component definitions.

Details:

Provides mounting elements for instances. The value can be a CSS selector, an actual HTML element, or a function that returns an HTML element. Note that the element is only used as a mount point. If a template is provided the element is replaced unless replace is false. Elements can be accessed with vm.$el.

It must be a function value when used in Vue.extend, so that all instances will not share elements.

If this option is specified during initialization, the instance will immediately enter the compilation process. Otherwise, you need to call vm.$mount() to start compilation manually.

The provided element can only be used as a mount point. Different from Vue 1.x, all mounting elements will be replaced by the DOM generated by Vue. Therefore, it is not recommended to mount the root instance on or .

If neither the render function nor the template attribute exists, the HTML of the mounted DOM element will be extracted and used as a template. At this time, the Vue library built by Runtime Compiler must be used. Everyone knows the role of

el, which is used to specify the mounting target of the Vue instance. We focus on the above two parts. To summarize: if there is a render function or template attribute, the mounted element will be replaced by the DOM generated by Vue; otherwise, the HTML where the mounted element is located will be extracted and used as a template

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <div id="ppp"></div>
    </body>
</html>

Copy after login

Example: DOM rendered by render function replaces

new Vue({
    el: &#39;#ppp&#39;,
    router,
    store,
    render: h => h(App)
})

Copy after login

Related free learning recommendations: javascript（ video)

The above is the detailed content of What does el mean in vue.js. For more information, please follow other related articles on the PHP Chinese website!