1、准备:页面引入vue,写渲染区域,实例化一个vue
2、写两个组件,并在渲染区域引用。
// 父组件
Vue.component("my-parent", {
data() {
return {
msg: "父亲的房子",
car:''
}
},
template: `
<div>
<fieldset>
<legend>父亲组件</legend>
<div>{
{msg}} {
{car}}
<button >父亲按钮</button>
</div>
</fieldset>
</div>`,
})
// 母亲组件
Vue.component("my-mother", {
data() {
return {
msg: "母亲的汽车",
house:''
}
},
template: `
<div>
<fieldset>