形容
父子组件能够利用 props 间接传值,在子组件中定义 props,并可规定传值类型,
当父组件应用子组件时传入相应参数,即可把父组件的数值传递到子组件中。
父组件 Father.vue
<template>
<div id="app">
{{msg}}
<last-children :msgchange='msgdata'></last-children>
</div>
</template>
<script>
import LastChildren from './components/lastChildren.vue'
export default {
components:{
LastChildren
},
data () {
return {
msg: '你好vue',
msgdata: '我是父组件传值'
}
}
}
</script>
子组件 lastChildren.vue
<template>
<div>
{{ msg }}
<span>{{ msgchange }}</span>
</div>
</template>
<script>
export default{
name: 'last-children',
data(){
return {
msg: '我是一个home组件'
}
},
props:{
msgchange: {
type: String
}
}
}
</script>
发表回复