步骤:
1、在子组件中用props创建一个属性(如:sha),用以接收父组件传过来的内容;
2、在子组件标签中添加子组件props中创建的属性;
3、在父组件注册子组件(import child from './child'),
4、在template中添加标签child(标签名字就是子组件的组件名),标签中添加属性sha,然后赋值(估值内容就是添加到子组件的值);
5、在components中添加子组件名称(child)。
child.vue
<template>
<div>
<h2>子组件</h2><hr/>
<h3>{{msg}}</h3>
// 2、在子组件标签中添加子组件props中创建的属性;
<h4>{{sha}}</h4>
</div>
</template>
<script>
export default{
data(){
return{
msg:'child页面'
}
},
// 1、在子组件中用props创建一个属性(如:sha),用以接收父组件传过来的内容;
props:['sha']
}
</script>
father.vue
<template>
<div>
<h2>父组件</h2>
<h3>{{msg}}</h3>
// 4、在template中添加标签child(标签名字就是子组件的组件名),标签中添加属性sha,然后赋值(估值内容就是添加到子组件的值);
<child sha="插入子组件数值内容"></child>
</div>
</template>
<script>
// 3、在父组件注册子组件
import child from './child'
export default{
data(){
return{
msg:"qqqqq"
},
// 5、在components中添加子组件名称(child)。
components:{
child
}
}
}
</script>