组件之间的传值
一、父组件给子组件传值
第一步：
在父组件的模板上调用子组件，并在这个子组件的标签上定义一个自定义属性，让这个自定义属性等于一个父组件定义过的属性或变量，也就是你想要传递过去的数据项，
注意：这里你在定义传递过去的参数时注意是否需要动态获取，当加冒号，也就是v-bind：时，表示接收的是一个变量，如果是普通的字符串的话，就不需要加动态获取
template:`<div>父组件 <son :fnum="farnum"></son></div>`,
data(){
return{
farnum:2,
}},
第二步：
在子组件上使用props方法进行数据接收，这个方法和定义的methods等为同级，这里接收的是自定义属性，现在这个属性可以直接在子组件中使用，如：{{fnum}}在页面渲染等等
data(){ return { sonnum:200 } },props:['fnum'],
在props中对父元素传递过来的值进行效验
props可以是一个数组也可以是一个对象，主要看使用需求，当想要对接收的某个值进行效验或设置某些关卡时，你需要把这个自定义属性名写成一个对象类型，而非字符串，在这个对象当中有以下一些属性：
type 规定传过来的值是什么类型，如果不符合要求就会报错，当规定多个时，可以写成数组
default 设置默认值，当没有传递的时候，可以在这个属性里定义一个默认值
required:true 规定为必须传值，如果不传就报错
validator(val){ }自定义效验器，这里的形参可以接收到传递过来的值，这里我们可以对传过来的值进一步的设置条件，而传过来的值也必须符合这个条件
例子：
props:{ sum:{
type:[Number,String],//校验类型
default:'9999',//如果没有传递，使用默认值
required:true,//必传
validator(val){//自定义校验器
if(val.length<7){
thrownewError('输入的长度不够');}
returnval.length>7;//必须满足条件才行}}}
备注：如果type要求传递的是一个数组类型的，当需要设置默认值default，的时候就需要定义返回一个数组
props:{ mary:{
type:[Array],
default(){
return[4,5,6] }}}
二、子组件给父组件传值
第一步：
在父组件模板调用子组件的时候，在子组件标签上添加自定义事件，并且绑定父组件的方法，这个方法里设一个形参用来接收传递过来的值
father:{template:`<div>father{{farnum}}<son @myson='add'></son></div>`,
data(){
return{
farnum:300,
}},
methods:{
add(val){
this.farnum*=val
}},
第二步：
在子组件中定义一个方法，用来触发this.$emit（）这个方法,去给父组件传值，在这个方法的括号中第一个形参是，在父组件上绑定的自定义事件名称，第二个是需要传递过去的值
son:{template:`<div>son<button @click='btn'>点击翻倍</button></div>`,
data(){
return{
sonnum:2,
}},
methods:{
btn(){
this.$emit('myson',this.sonnum)
}}}
