props之数据验证

验证的类型可以是：
String，Number，Boolean，Object，Array，Function

props:{ props1:Number, //必须是数值类型 props2:[String,Number], // 数字类型 || 字符串 props3:{ type:Number, // 数值型 true为必传 required: true},props4:{ type:Boolean, // 布尔值 default默认为true default: true},props5:{type: Array, // 如果是数组 || 对象 默认值必须是一个函数返回default:function{ return [];}}}

好了，我们开始进入主题吧!

父组件如下：

<template><div><input type=”text” v-model=”msg”> <!– v-model双向绑定 –><son :datas=msg></son> <!– 子组件通过datas接收msg数据 –></div></template><script>import son from ‘引入子组件’;export default {component:{ son }, // 注册组件data(){ return{ msg:’我是父组件数据’}}}</script>

子组件如下：

<template><div>{{datas}} <!–这里就可以传过来的显示数据了–></div></template><script>data(){ props:{ datas:{ // 这里的datas用于接收 type:String, // 我们接收验证的是字符串 也可以验证别的类型}}}</script>