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

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐