父组件向子组件传值

步骤：

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>