首頁 > 文章 > web前端 > vue.js中的el什麼意思

vue.js中的el什麼意思

coldplay.xixi原創: 2020-11-09 16:55:278368瀏覽

vue.js中的el的意思：el的型別有【String | HTMLElement | Function】，作用是為實例提供掛載元素，如果存在render函數或template屬性，則掛載元素會被Vue產生的DOM替換。

vue.js中的el什麼意思

【相關文章推薦：vue.js】

vue.js中的el的意思：

類型： String | HTMLElement | Function

限制： 在元件定義中只能是函數。

詳細：

為實例提供掛載元素。值可以是 CSS 選擇符，或實際 HTML 元素，或傳回 HTML 元素的函數。注意元素只用作掛載點。如果提供了模板則元素被替換，除非 replace 為 false。元素可以用 vm.$el 存取。

用在 Vue.extend 中必須是函數值，這樣所有實例不會共用元素。

如果在初始化時指定了這個選項，實例將立即進入編譯過程。否則，需要呼叫 vm.$mount()，手動開始編譯。

提供的元素只能作為掛載點。 不同於 Vue 1.x，所有的掛載元素會被 Vue 產生的 DOM 取代。因此不建議掛載 root 實例到 100db36a723c770d327fc0aef2ce13b1 或 6c04bd5ca3fcae76e30b72ad730ca86d 上。

如果 render 函數和 template 屬性都不存在，掛載 DOM 元素的 HTML 會被提取出來用作模板，此時，必須使用 Runtime Compiler 建立的 Vue 函式庫。

el 的作用大家都知道，用來指明 Vue 實例的掛載目標。我們將重點放在上面兩個部分，總結一下就是：如果存在render 函數或template 屬性，則掛載元素會被Vue 產生的DOM 取代；否則，掛載元素所在的HTML 會被提取出來用作模版

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

範例：render 函數渲染的DOM 替換b6e927d7e9bbb9062e270db5cafd5aef16b28748ea4df4d9c2150843fecfba68

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

相關免費學習建議：javascript（影片)

以上是vue.js中的el什麼意思的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：vue.js怎麼為input新增事件下一篇：vue.js怎麼為input新增事件

看更多