Vue中Prop默认值为什么要为工厂函数的形式返回？

今天药忘吃喽~ 2022-08-29 13:47 44阅读 0赞

## Vue中Prop默认值为什么要为工厂函数的形式返回？ ##

> 看过一篇文章：  
> 原文说Object与数组类型default需要用一个函数返回，但是Type可以为Function,Function不也是Object吗？Function类型得default直接default:()=>\{\}就行了，为啥不需要default:()=>()=>\{\}

> 有人说是为了不影响父组件，可是你用不用默认值修改引用类型得prop都会改变父组件得啊，文档中得Object不知道到底包不包括Function，关于子组件修改Prop这一段，原文说Object与Array会影响父组件，然而我想Function也是引用类型同样也会影响父组件，而关于prop默认值却只是Object与Array需要用工厂函数返回，不然报错，Function类型却可以直接default:()=>\{\}

> 这和data要返回函数是一个意思。  
> 因为object 和数组都是引用类型，地址（指针）是一样的。  
> 必须返回一个函数，才能使用不同的地址，才能区分开不同的组件。

> 1.假设我们的组件在使用的时候没有给它传递参数值，这时组件实例将会使用默认值。  
> 2.如果参数类型是 Object （它包含了 plain object，假设这里我们使用的是 plain object，比如：\{ name: ‘Bill’, age: 20 \}），或者类型是 Array，这时在有多个组件实例（同一组件的实例）的场景下，没有用函数返回默认值的话，这些实例共享的是同一块堆结构（同一个引用），实例1改变了其中的属性值，那么实例2中的属性值也是跟着改变了。用函数返回的话，就能解决这个问题，因为每次初始化组件实例的时候都会重新申请一块堆。  
> 3.如果参数类型是一个函数，即使多个实例共享的同一个引用，我们确实可以去更改它的属性值（比如原型上的值），但实际上我们根本不会这么做，每个实例中都是去调用这个函数，函数体内产生的影响只会作用于组件实例本身。举个例子，比如我有一个工具函数（用来格式化时间），我需要在每个要用到它的文件里面都单独写一份吗？我只要声明一份就行了。  
> 4.父组件直接传递值只针对我当前页面中构建的那个组件实例，对其他实例无关。就像一个构造函数，给它传递的参数不一样，构建的实例也是不同的、独立的。

> https://forum.vuejs.org/t/vue-prop/116083/2