<div id="app">
<basic-component v-bind.sync="content"></basic-component>
姓名: {{ content.title }}
<br>
職稱: {{ content.description }}
</div>const BasicComponent = {
template: `<div @click="clickHandler">
BasiceComponent
</div>`,
methods: {
clickHandler () {
this.$emit('update:title', 'New World')
this.$emit('update:title', 'LandyII')
this.$emit('update:description', 'Barista')
}
}
}
Vue.component('basic-component', BasicComponent)
new Vue({
el: '#app',
data: {
content: {
title: 'Landy',
description: 'Engineer'
}
}
})
External CSS
This Pen doesn't use any external CSS resources.