最近项目中因为Vue 的 prop 传递对于对象和数组是引用传递导致的bug个人觉得有必要总结一下。首先要了解Vue 的 prop 传递的两种主要的传递方式：分别是单向数据流和响应式更新。对于对象和数组这两种复杂数据类型，Vue 的 prop 传递实际上是引用传递，这意味着当父组件中的对象或数组被修改时，子组件中通过 prop 接收的相应数据也会相应地更新。
引用传递的特点
-
实时更新：如果父组件中的对象或数组被修改（例如添加、删除或修改其内部元素），子组件通过 prop 接收的引用也会实时反映这些变化。
-
单向数据流：尽管是引用传递，但 Vue 仍然遵循 props 的单向数据流原则。这意味着你不应该在子组件中直接修改通过 prop 传递的对象或数组
由于我在父组件中定义并更新了initialData
子组件中使用并且修改了initialData
导致this.form.tblCatalogueList（父组件）this.initialData（子组件的 prop）this.rightDataSource（子组件的数据）这三个变量都指向同一个数组引用。
因此，当在子组件中修改 rightDataSource 时，实际上也在修改 this.form.tblCatalogueList，因为它们是同一个数组。从而导致了子组件数据被修改后父组件中的this.form.tblCatalogueList同时被修改的bug