简述父组件给子组件props传参,子组件接收的6种方法 ?
在 Vue 中,父组件给子组件传参主要通过 props 属性。以下是子组件接收 props 的六种常见方式:
- 基础用法:在子组件中,直接通过 props 选项来定义要接收的参数。
props: ['myProp']
- 指定类型:我们可以指定 props 的类型,例如 String,Number,Boolean,Object,Array,Function,Symbol。
props: { myProp: String }
- 默认值:我们可以为 props 指定默认值。
props: { myProp: { type: String, default: 'default value' } }
- 必需字段:我们可以指定某个 prop 为必需的。
props: { myProp: { type: String, required: true } }
- 验证 props:我们可以为 props 提供一个验证函数,用于自定义验证。
props: { myProp: { validator: function(value) { // 返回 true 或 false return value > 0 } } }
- 多种类型:如果 props 可以接收多种类型,我们可以使用数组形式定义。
props: { myProp: [String, Number] }
以上六点是 Vue 中子组件接收 props 的常见方式,每种方式都有其应用场景,可以根据具体需求选择合适的方式。