在項(xiàng)目中，我們經(jīng)常會(huì)用到許多類似的效果，若一直進(jìn)行復(fù)制粘貼，會(huì)導(dǎo)致代碼重復(fù)性太高，且后期維護(hù)代價(jià)嚴(yán)重，為方便項(xiàng)目的開(kāi)發(fā)和維護(hù)，可以根據(jù)封裝的思想，將頁(yè)面上可重用的部分封裝成自定義組件。
首先在components文件夾下創(chuàng)建一個(gè)Vue組件，里面封裝所需要的代碼。
props中設(shè)定的是標(biāo)簽中的屬性，用于父組件向自定義組件中傳值。
注意：自定義組件中根元素只能有一個(gè)。
接著在外面創(chuàng)建Vue實(shí)例。
Vue中組件的引用原則是先注冊(cè)后使用。import導(dǎo)入后，首先要在components中注冊(cè)組件并設(shè)置組件名，接著我們就可以使用這個(gè)自定義組件了。在標(biāo)簽中，我們可以給剛才在props中設(shè)置的vfor屬性傳值。
然后保存，我們發(fā)現(xiàn)頁(yè)面中已經(jīng)渲染出vfor-list對(duì)象里的值。
上一篇： 什么是es6——解構(gòu)賦值
下一篇： Vue自定義組件中$emit的用法
