當(dāng)前位置：首頁 > 编程资源 > 综合教程 >内容正文

综合教程

什么是vue.js组件

發(fā)布時(shí)間：2023/12/31 综合教程 20 生活家

生活随笔收集整理的這篇文章主要介紹了什么是vue.js组件小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

vue.js組件是用來完成特定功能的一個(gè)自定義的HTML標(biāo)簽，分為全局組件和局部組件，全局組件可以在任何被掛著的標(biāo)簽中使用，局部組件是定義在某個(gè)vue實(shí)例上的。

【相關(guān)文章推薦：vue.js】

組件是用來完成特定功能的一個(gè)自定義的HTML標(biāo)簽

例如：

<body>
    <mytag></mytag>
</body>

注意: mytag就是一個(gè)組件, 該組件必須通過Vue為mytag賦予一定的功能

組件的作用

組件是對(duì)特點(diǎn)功能代碼(html,css,js)的封裝, 通過組件的名字可以重復(fù)利用該組件中的代碼.

組件分類:

全局組件和局部組件

注意：組件的template模板必須有且只有一個(gè)根標(biāo)簽（所有內(nèi)容必須由一個(gè)標(biāo)簽套起來）。

全局組件

1、全局組件的語法:

Vue.component("自定義標(biāo)簽的名字",{配置對(duì)象})

2、全局組件的特點(diǎn):

全局組件可以在任何被掛著的標(biāo)簽中使用.

全局組件的配置對(duì)象中必須包含template屬

局部組件-是定義在某個(gè)vue實(shí)例上的

1、局部語法:

var app = new Vue({
    el: "#app",
    data: {},
    components : {
       　"局部組件的名字1" : {組件的配置對(duì)象}
       　　 "局部組件的名字2" : {組件的配置對(duì)象}
    }
});

2、局部組件的特點(diǎn)

局部組件只能夠在所掛載的標(biāo)簽中使用。

相關(guān)免費(fèi)學(xué)習(xí)推薦：JavaScript（視頻）

總結(jié)

以上是生活随笔為你收集整理的什么是vue.js组件的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。