vue-props的default写不写有什么区别

注意 default 不要写成 defaults 

例如有一个名为mk-test的组件如下：

<template>
    <div>{{maxLength}}</div>
</template>
<script>
export default {
    props: {
        maxLength: {
            type: Number,
            default: 1
        }
    }
}
</script>

当父组件这样调用时：

<mk-test></mk-test>

渲染出来是：

1

如果把组件的default:1删除，父组件调用方式不变，此时渲染结果是：

0

此时如果父组件改成：

<mk-test maxLength="3"></mk-test>

此时渲染结果是：

3

自我总结：

1、使用default定义默认值时，如果父组件有传值，则用父值渲染。如果父组件没有传值，则使用默认值。

2、没有定义默认值时，如果父组件有传值，则用父值渲染。如果父组件没有传值，则使用的是该类型的默认值。类型及其默认值如下：

String   ''

Number  0

Array []

Object  {}

转载于:https://www.cnblogs.com/mankii/p/11475399.html