VUE组件2数据传递

传递数据

　prop验证

　　除了传递数组，也可以传递对象

Vue.component('test',{
        props:{
          price:Number,
          unit: String
        }
      })

　　如果price不是数字，vue就会抛出错误，prop可以是多个类型中的一个，可以为他传递一个包含所有有效类型的数组，例：price:[Number,String,Price]

　　也可以指定一个prop是否必须

Vue.component('test',{
        props:{
          price:{
            type:Number,
            required:true,
　　　　　　　validator(val){
　　　　　　　　return val>= 0
　　　　　　　　}
          },
          unit: {
            type:String,
            default:"$"
          }
        }
      })

　　上面这个示例中，price 是必须的prop,如果没有给他传递值，就会抛出警告，unit不是必须的，但是有个默认值“$"。

　　最后我们可以传递一个验证函数，该函数以prop的值作为参数，在prop有效是返回true，无效时返回false.

响应式：v-bind：要传递的数据