各组件之间的参数传递

各组件之间的参数传递

父传子

通过子组件的props部分，来指明可以接受的参数，父组件通过在标签中写明参数的键值对来传递参数。

props两种写法:

//第一种
props:['参数1','参数2']
//第二种
props:[
    '参数1':{
    	type:String,
    	required:true,
    	default:'XX'
    }
]

子传父

改进版的参数传递

从下往上的事件发射

sub1.vue

doClick:function(){
    this.$emit('newName','xiaohu');
}

App.vue

<sub-app :myName="name" @newName="name=$event"></sub-app>

是以事件发射的方式来实现子传父的效果。

​ 在子组件中，使用this.$emit(“键”,“值”)

​ 在父组件中，子组件的标签中使用@键="msg= e v e n t " 其 中 event" 其中 event"其中event就能得到值，msg是父组件中vue的属性

签中使用@键="msg= e v e n t " 其 中 event" 其中 event"其中event就能得到值，msg是父组件中vue的属性