new vue()
就可以認為是乙個大元件,但多個例項這樣太low了,vue為我們提供了component
。
1.全域性註冊的元件
要註冊乙個全域性元件,你可以使用vue.component(tagname, options)
,例如:
//註冊
vue.component('my-component', );
//建立根例項
var vm = new vue();
註冊一定要在例項化之前。
然後就可以在模板上使用名為my-component
的這個元件了:
id="box">
my-component>
div>
同樣可以有data
,但元件裡的data
是乙個函式,該函式返回乙個物件:
vue.component('my-component', }
', data:function
() }
});
元件中的事件,還是照樣寫:
vue.component('my-component', }
', data:function
() },
methods:
}});
2.區域性註冊
//定義元件
var child = }
', data:function
() },
methods:}};
//建立根例項
var vm = new vue(
});
所謂「區域性元件」就是放的乙個元件的裡面,這裡vue的例項其實就是乙個大元件。
先定義好元件,然後在vue例項化的時候傳入。
Vue元件基礎
vue.component button counter template you clicked me times.這裡的data必須是乙個function,不能是物件。因為如果是物件,多個元件引用的是相同的data。如果是function,那麼每次返回的都是不同的data物件,這樣元件之間引用的...
Vue入門 元件基礎
元件 專案的開發,就是乙個元件樹,元件可以進行復用。元件的名字 1.html標籤不區分大小寫 2.不能跟系統標籤重名 3.遵循 w3c 規範中的自定義元件名 字母全小寫且必須包含乙個連字元 4.支援駝峰命名.myheader,但是在引用的時候,需要使用my header的方式元件支援兩種定義方式 全...
Vue元件使用基礎
這篇博文用來記錄.vue元件的使用方法。可以把元件 按照template style script的拆分方式,放置到對應的.vue檔案中。模板 template 初始資料 data 接受的外部引數 props 方法 methods 生命週期鉤子函式 lifecycle hooks 在html中使用元...