父组件向子组件传值 (用属性传值)
1. 在父组件中定义要传的值 有2种大的类型
1.传值包括 string number boolean
2.传引用包括 array object 改变一处,所有的引用都改变
2.用v-bing将值绑定到子组件标签上。
3.在子组件中用props接收绑定的值。
4.最后就可以在methods里的方法中通过this 获取和操作这个值了。
举个栗子:父组件中的
<template>
<div id="home">
<header v-bind:fu="ti"></header>
<footer v-bind:fu="ti"></footer>
</div>
</template>
<script>
import Header from './Header'
import Footer from './Footer'
export default {
name: 'home',
components:{
"header":Header,
"footer":Footer,
},
data(){
return{
ti:"我是string父传子的"
}
},
name:'header',
// props:["fu"],
//属性传直
props:{ //接收父传过来的
fu:{type:String,required:true}
},