在React中向对象数组头部添加元素的实现求助

因为是父组件传入的prop数组，不能直接修改原数组（违反单向数据流原则），必须通过创建新数组的方式实现需求，以下是几种可行方法：

方法1：扩展运算符（推荐） #

用扩展运算符将新对象和原数组元素组合成新数组，新对象自动排在头部：

// 假设从prop接收的数组名为 parentArray
const myArray = [myObj, ...parentArray];

方法2：先复制数组再用unshift #

先复制原数组，再给复制后的数组添加元素到头部，避免修改原prop：

const copiedArray = [...parentArray];
copiedArray.unshift(myObj);
// copiedArray 就是目标数组

方法3：使用concat方法 #

通过concat合并包含新对象的数组和原数组，返回新数组：

const myArray = [myObj].concat(parentArray);

关键提醒 #

所有方法都要确保是生成新数组，不要直接操作父组件传入的原prop数组，否则会触发Vue的警告，还可能导致数据流向混乱。

内容的提问来源于stack exchange，提问作者ILLIA