vue.
component
('自定義元件名',}
'// 自定義模板 裡面套html標籤, 可以取屬性的值
})
vue.
component
('lover',)
;new
vue(})
;<
/script>
>
>
lover
>
div>
/* 自定義元件模板 bitqian標籤 */
vue.
component
("bitqian",}'
});new
vue(})
;<
/script>
v-for
="item in items"
v-bind:language
="item"
v-bind:key
="item.index"
>
bitqian
>
lang
="en"
>
>
charset
="utf-8"
>
>
vue 元件繫結值title
>
src=
"../js/vue.js"
>
script
>
head
>
>
>
>
lover
>
/>
v-for
="item in items"
v-bind:language
="item"
v-bind:key
="item.index"
>
bitqian
>
div>
>
vue.
component
('lover',)
;/* 自定義元件模板 bitqian標籤 */
vue.
component
("bitqian",}'
});new
vue(})
;script
>
body
>
html
>
lang
="en"
>
>
charset
="utf-8"
>
>
slot插槽 結合vue元件 實現模板化title
>
src=
"../js/vue.js"
>
script
>
head
>
>
>
v-for
="item in items"
v-bind:language
="item"
>
my-component
>
div>
>
>
slot
="demo-title"
v-bind:title
="title"
>
demo-title
>
slot
="demo-item"
v-for
="(item, index) in items"
:item
="item"
v-bind:index
="index"
>
demo-item
>
demo-component
>
div>
>
// vue元件複習
vue.
component
('my-component',}'
})newvue(}
)/* slot 插槽定義 元件通過插槽套元件 */
vue.
component
('demo-component',)
// 標題元件
vue.
component
('demo-title',}
'})// 標題下面對應的每一項
vue.
component
('demo-item'
,}**********} '})
// vue例項 給元件提供資料
let vm =
newvue(}
)script
>
body
>
html
>
lang
="en"
>
>
charset
="utf-8"
>
>
vue 插槽複習title
>
src=
"../js/vue.js"
>
script
>
head
>
>
>
>
slot
="my-title"
v-bind:title
="title"
>
my-title
>
slot
="my-content"
v-for
="(item, index) in items"
:content
="item"
:index
="index"
:key
="index"
v-on:remove
="removeitems(index)"
>
my-content
>
my-component
>
div>
>
vue.
component
('my-component',)
vue.
component
('my-title',}
'}) vue.
component
('my-content'
,} ***** } 移除',
//繫結了remove
methods:}}
)let vm =
newvue(,
methods:}}
);script
>
body
>
html
>
flex自定義元件和自定義事件
看了乙個帖子,自己寫了一下。主要講了自定義元件跟自定義事件。先看一下自定義事件。就跟在殿堂之路中寫道一樣。如生活,理解 就如理解生活一樣一樣的。什麼是事件,事件是怎麼運作的呢?我是這樣理解的 比如去了一家餐館就餐,首先要制定服務員 我要求穿白裙子的那個美女為我服務 端茶倒水,上菜 所以我落座後,說的...
Vue元件中自定義事件
當我們需要在操作元件後引起元件之外的元素發生變化時,就需要是這裡的內容。比如 當選中書後,自動顯示您選中的書名。其中書籍列表是使用元件寫的。顯示選中書籍名是在元件之外。在新增事件的時候需要注意一下事項 1 在定義元件時 vue.component 元件名,在子元件中正常呼叫該事件,但是在需要與父元件...
Vue 自定義元件
元件 component 是vue.js 最強大的功能。元件可以封裝可重用的 通過傳入物件的不同,實現元件的復用,但元件傳值就成為乙個需要解決的問題。父元件向子元件傳值 元件例項的作用域是孤立的。這意味著不能在子元件的模板內直接引用父元件的資料。要讓子元件使用父元件的資料,我們需要通過子元件的 pr...