《vue-组件-2-数据验证》

1、数据验证

验证的 type 类型可以是：

• String
• Number
• Boolean
• Object
• Array
• Function

<div id="app">
        <input type="text" v-model="d">
        <app2 :a="a" :b="b" :c="c" :d="d" :f="f" :g="g"></app2>
</div>

 Vue.component('app2',{
            props:{
                a:String,
                b:[Number,String],
                c:{
                    type:Boolean,
                    default:true
                },
                d:{
                    type:Number,
                    required:true,
                },
                e:{
                    type:Array,
                    default(){
                        return[789];
                    }
                },
                //自定义一个验证函数
                f:{
                    validator(value){
                        return value < 10;
                    }
                },
                g:{
                    type:Function,

                }
            },
            template:'<div>{{a}}--{{b}}--{{c}}--{{d}}--{{e[0]}}--{{f}}--{{g}}</div>',
            data(){
            return{
                
                }
            
            }
        })

        new Vue({
            el:'#app',
            data:{
                a:"1",
                b:123,
                c:true,
                d:456,
                e:[],
                f:9,
                g:console.log(),

            }

        })