vue——组件参数校验与非Props特性

组件参数校验与非Props特性

1、组件参数校验：父组件向子组件传递的数据，子组件有权对这些数据进行约束。

要进行约束的话，props就要是一个对象而不是数组，对象的键就是接收的参数的名字，对象的值是接收的参数需要满足的条件。

<div id="root">
 	<child :content="'hello world'"></child>
</div>
<script>
Vue.component('child',{
	//参数校验
	//1、规定传过来的数据content必须是string类型。
	props:{content:String}
	//2、数组方式,规定传过来的content要么是数字要么是字符串。
	props:{content:[Number,String]}，
	//3、对象方式
	props:{
		content:{
		 	 type:String,    //type表示数据要满足的类型
		 	 required:true, //required表示是否必填（值为true/falsle）
		 	 default:'default value', //default是数据默认的内容。
			 	 //alidator是自定义校验器（名称是固定的，内容为自定义），value是传入的数据内容，不满足里面定义的内容就会报错。
				 validator:function(value){
				  return (value.length>5)
				 }
			}
	},
	template:'<div>{
  {content}}</div>'
})
var vm = new Vue({