Vue父组件传值

把子组件的数据传递给父组件

<template>
<div id="app">
	<h1>{
    
    {
    
    username}}欢迎你</h1>
	<hello-world user="老陈" :brief="brief"></hello-world> //绑定后可以传递变量
	<hello-world></hello-world>
	<hello-world></hello-world>
</div>
</template>

<script>
import HelloWorld from './components/HelloWorld'
export default{
    
    
	name:'App',
	data:function(){
    
    
		return{
    
    
			username:"我们",
			brief:{
    
    
				title:"我们一点也不欢迎你",
				desc:"还是欢迎一下吧"
			}
		}
	},
	methods:{
    
    
		
	},
	components:{
    
    
		HelloWorld
	}
}
</script>
<template>
	<div class="hello">
	这是Hello{
    
    {
    
    user}}组件
	<div>这是HELLO{
    
    {
    
    user}}组件</div>
	<div>{
    
    {
    
    brief.title}}</div>
	<div>{
    
    {
    
    brief.dsc}}</div>
	</div>
</template>
<script>
export default{
    
    
	props:["user","brief"]
}
</script>

猜你喜欢

转载自blog.csdn.net/sinat_33940108/article/details/112470796