Vue入门 Demo15 组件参数校验

Vue入门 Demo15 组件参数校验

<!DOCTYPE html>
<html lang="en"> 
    <head> 
        <meta content="text/html; charset=utf-8" /> 
        <title>组件参数校验</title> 
        <script src="./vue.js"></script>
        
    </head> 
    <body>
        <div id="app">  
            <child content="hello world"></child>
        </div>
        <script>

            Vue.component('child',{
                template: '<div>{{content}}</div>',
                props: {
                    //指子组件获取父组件传递过的数据属性必须是String类型
                    // content: String,

                    //也可以是对象校验
                    content: {
                        type: String,
                        required: true,
                        default: "default value",
                    }
                }
            })
        
            var vm = new Vue({
                el: "#app",
            })
        </script> 
    </body> 
</html>
发布了44 篇原创文章 · 获赞 2 · 访问量 5143

猜你喜欢

转载自blog.csdn.net/qq_36778310/article/details/104712804
今日推荐