reactjs Map中的“关键” prop

zdwk9cvp  于 2023-01-12  发布在  React
关注(0)|答案(1)|浏览(132)

新手在这里,抱歉的愚蠢的问题:)
我该怎么把“钥匙”这个 prop 放到这个函数里呢?
代码是在上面的接触阴影。我尝试了很多方法,但所有的方法,我尝试了工作不正常。你能请检查,并告诉我如何把“关键”的 prop ?

import React, { Suspense, useEffect, useMemo, useRef, useState } from "react";

import "./PartOne.css";

const PartOne = () => {
const [rooms, setRooms] = useState([
    Room1,
    Room2,
    Room3,
    Room4,
    Room5,
    Room6,
    Room7,
    Room8
]);

useEffect(() => {
    console.log("rooms state:", rooms);
}, [rooms]);

return (
    <div className="wrapper">
        {rooms.map((room, roomIndex) =>
            room({ position: positions[roomIndex] })
        )}
    </div>
);
};
export default PartOne;

谢谢

ghg1uchk

ghg1uchk1#

你可以将room函数中的元素 Package 在<React.Fragment>中,并将key赋给它:

return (
    <div className="wrapper">
        {rooms.map((room, roomIndex) => (
            <React.Fragment key={`${roomIndex}`}>
                {room({ position: positions[roomIndex] })}
            </React.Fragment>
        ))}
    </div>
);

相关问题