父组件传值props及$emit

 1.props:用来接收父组件传递的数据,可以是数组,也可以是对象
 如果是对象,

type可以是String,Number,Boolean,Array,Object,Date,Function,Symbol,自定义构造函数
 default: 给父组件传入的数据一个默认值,如果父组件没有数据传入,就用默认值,如果传入,则是父组件传入的值。对象或数组的默认值必须从一个函数返回
 required: true/false 这个传入的prop是否必填
 validator: 函数,对传入的数据进行校验

props: {
	 propsName: {
		 type: Number,
		 default: defaultValue,
		 validator: function (value) {
			return value >= 0
		  }
	 },
	 data: {
	 		 type: Array,
	 		 default: () => []
	 },
	 data1: {
	 		 type: Array,
	 		 default: () => [1,2,3]
	 },
	 data2: {
	 		 type: Array,
	 		 default: () => [
				 {
					 id: 1,
					 name: 'aaaa'
				 },
				 {
					 id: 2,
					 name: 'bbbb'
				 }
			 ]
	 },
	 obj:{
		 type: Object,
		 default() => {}
	 },
	 obj1: {
		 type: Object,
		 default() {
			 return {
				 name: 'abc',
				 age: 20
			 }
		 }
	 }
}

2.$emit

$emit(eventName,[...args]) :点击子组件向父组件传递事件名称和参数,事件名称String类型,参数可以是多个,
 父组件监听子组件触发的事件@eventName="handleEvent",然后在父组件响应handleEvent事件



	
		
		
		
	
	
		

 

 

你可能感兴趣的:(Vue)