23_父传子_组件间通信（props）

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <div id="app">
            <my-component :msg="msg"></my-component>
        </div>
        <script src="js/vue.js"></script>
        <script>
            Vue.component('my-component',{
                template:"<div><p>{{msg}}</p></div>",
                //父组件的数据传递给子组件时，通过props属性传递
                //props的写法：
                //第一种
                props:['msg']   //用对应的变量名接受对应的自定义属性的值
                //第二种
//              props:{
//                  msg:{
//                      //配置接收的数据类型、验证
//                      type:[String,Number]
//                      required:true
//                  }
//              }
            });
            
            var vm = new Vue({
                el:"#app",
                data:{
                    msg:"hello"
                }
                
            })
        </script>
    </body>
</html>
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容