vue props验证 

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <script type="text/javascript" src="js/vue.js"></script>
</head>
<body>
<div id="app1">
    <p>{{message}}</p>
    <!-- v-on 可以缩写成 @-->
    <!-- v-bind:  可以缩写成 :-->
    <first-com mss1="hello world!" :mss2="forComParam"></first-com>
    
</div>

</body>
<script type="text/javascript">
    Vue.component('first-com', {
        props: {
            mss1:String,
            mss2:{
                type:Number,
                required:true
            }
        },
        template: "<div>{{mss1}}{{mss2}}</div>",
    
    
    })

    

    var v1 = new Vue({
        el: "#app1",
        data: {
            message: "第一个作用域",
            forComParam: 123
        }

    })


</script>
</html>

 

posted @ 2018-03-08 23:22  pengc  阅读(593)  评论(0)    收藏  举报