饿了么项目---6、使用Props传递数据

来源:互联网 发布:php流媒体服务器 编辑:程序博客网 时间:2024/06/15 03:28

一、使用Prop的场景与意义

组件实例的作用域是孤立的。这意味着不能 (也不应该) 在子组件的模板内直接引用父组件的数据。要让子组件使用父组件的数据,我们需要通过子组件的 props 选项。
子组件要显式地用 props 选项声明它期待获得的数据

二、使用方法

// 简单语法Vue.component('props-demo-simple', { props: ['size', 'myMessage']})// 对象语法,提供校验Vue.component('props-demo-advanced', {props: { // 只检测类型    height: Number, // 检测类型 + 其他验证 age: { type: Number, //或者也可以是object对象类型default: 0, required: true, validator: function (value) { return value >= 0 } } }})

父组件中这样传入数据

<v-header :seller = 'seller'></v-header>
原创粉丝点击