How do I reconstructed an array of object and return a new array before passing it into the child co-CodePudding

In my React component I receive an array of objects myData (6 items). I have to reconstructed the array before passing it into the child component.

The 6th item in the array should be replaced by some custom jsx. Then the new array should be passed into the child component.

const MyComponent = ({ items }: Props) => {
  const myData = { items };

  return items?.length ? (
    <MyChild data={myData} />
  ) : null;
};

export default MyComponent;

What's the best way to achieve this?

CodePudding user response：

array[array.length-1] = <div>Hello</div>

if you want something better you have to give me more to work with.

CodePudding user response：

I would recommend you learn methods for working with arrays. There a lot of approaches. It's one from them

const myArray = [{item1}, {item2}, {item3}, {item4}, {item5}, {item6}];
<div>
    {myArray.slice(1,5).map((item, index) =>  item)}
</div>