reactjs - 如何将 Map 作为参数从一个 .tsx 文件传递​​到另一个 .tsx 文件？

Question

我已经在我的主文件中声明了一个地图。我有另一个文件测试，我想将我的地图传递给它。下面是我的 Main.tsx 文件

const [testMap] = useState(new Map<string,PersonInfo|undefined>());
<Test list={testMap}/> //This is my Main.tsx file

下面是我的 Test.tsx 文件的代码

interface Temp {
list:Map<string,PersonInfo|undefined>;
}
export default (
{list}:Temp
) => {
return (
<>
<p>
//Here i want to display the size of my map
</p>
</>
);
};

我想显示我作为参数传递的地图的大小，但我无法这样做。我该如何解决这个问题？

Answer 1

你应该可以使用

interface Temp {
    list:Map<string,PersonInfo|undefined>;
}

export default ({list}:Temp) => {
    return (
        <p>
        //Here i want to display the size of my map
        {list.size()}
        </p>
    );
};

此外，如果您想使用片段，这在此处不是必需的，您必须确保调用您的 Test.jsx 组件的父级将其显示在 html 元素中，如 div。

<div>
    <Test list={testMap}/> //This is my Main.tsx file
</div>