1、父向子传递数据 通过 自定属性 子组件通过 props 来接受数据

父组件模板区域:

<Father :msg="message" :user="userInfo"></Father>

父组件数据区域:

data(){

        return {

                message: '微微一笑很倾城',

                userInfo: {

                        name: '贝微微',

                        age:24

                }

        }

}

子组件模板

<div>{{msg}}</div>

<div>{{user.name}}</div>

<div>{{user.age}}</div>

子组件 props 由 数组 接受

props: ['msg','user']

子组件 props 由 对象形式 接受

props: {

        msg:{

                type:String,

                default:‘默认值’

        },

        user:{

                type:String,

                default:‘默认值’

        }

}

注意 props传递过来数据 不能修改的

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐