Invalid default value for prop "pageSizeArr": Props with type Object/Array must use a factory function to return the default value.

Invalid default value for prop "pageSizeArr": Props with type Object/Array must use a factory function to return the default value.

这个错误提示表明你在 Vue 组件中定义 pageSizeArr 属性(prop)时,为数组/对象类型的 prop 提供了直接的默认值,而没有使用工厂函数返回默认值。这是 Vue 的 prop 验证规则要求的。

在 Vue 中,当 prop 的类型是 Object 或 Array 时,默认值必须通过工厂函数返回,而不能直接赋值。这是因为对象和数组是引用类型,直接赋值会导致所有组件实例共享同一个引用。

错误示范:

props: {
pageSizeArr: {
type: Array,
default: [10, 20, 50, 100] // 直接赋值数组,这是错误的
}
}

正确书写格式

方式一
props: {
pageSizeArr: {
type: Array,
default: () => [10, 20, 50, 100] // 使用箭头函数返回新数组
}
}
方式二
props: {
pageSizeArr: {
type: Array,
default: function() { // 使用普通函数返回新数组
return [10, 20, 50, 100]
}
}
}
对象数据
props: {
config: {
type: Object,
default: () => ({ // 对象也需要工厂函数
pageSize: 10,
total: 0
})
}
}

注意项:

    开发中关于props默认值的使用需要注意其格式需求。

六月初字帖坊小程序 你想要的字帖模板及工具,这里都有!