Javascript 在JSX中使用函数

我有4个对象的数组。我有一个函数，它从中返回3个随机值。我的javascript代码正在工作，但我想在JSX中显示这些值

const postLinks=[
{
链接：“/link1”，
标题：“标题1”，
},
{
链接：“/link2”，
标题：“标题2”，
},
{
链接：“/link3”，
标题：“标题3”，
},
{
链接：“/link4”，
标题：“标题4”，
},
];
常量Home=（）=>{
常量三链接=（）=>{
常量resLinks=postLinks
.sort（（）=>Math.random（）-Math.random（））
.切片（0,3）；
//console.log（resLinks）
const finalRes=resLinks.map（（项目）=>{
返回{itemTitle:item.title，itemLink:item.link}；
});
控制台日志（最终）；
返回最终结果；
};
三通（）；
返回(
{finalRes}
)
}

不需要在单独的函数中包含此功能，但如果您想将此功能移到组件之外，则最好将其移到组件之外，至少只要它不依赖于任何道具即可

如果你不能做到这一点，你似乎在暗示，那么为什么要有一个函数呢？只需直接在组件中执行代码

但更重要的是：不能使用React渲染普通对象。实际上，您必须将数据映射到某些元素

const postLinks=[{
链接：“/link1”，
标题：“标题1”，
},
{
链接：“/link2”，
标题：“标题2”，
},
{
链接：“/link3”，
标题：“标题3”，
},
{
链接：“/link4”，
标题：“标题4”，
},
];
常量Home=（）=>{
const threeLinks=postLinks
.sort（（）=>Math.random（）-Math.random（））
.切片（0,3）；
返回(
{threeLinks.map（link=>{
//为数据创建元素。
返回{`${link.title}:${link.link}`}
})}
)
}
render（，document.body）

是代码的环境

我认为你错过了对图书馆的参考，正如@Felix Kling所提到的

除此之外，你正在做一些我不清楚的数据争论

从“React”导入React；
常量postLinks=[
{
链接：“/link1”，
标题：“标题1”
},
{
链接：“/link2”，
标题：“标题2”
},
{
链接：“/link3”，
标题：“标题3”
},
{
链接：“/link4”，
标题：“标题4”
}
];
常量getLinks=（）=>{
常量resLinks=postLinks
.sort（（）=>Math.random（）-Math.random（））
.切片（0,3）；
返回resLinks.map（（项目）=>(




));
};
常量Home=（）=>{
const result=getLinks（）；
返回{result}；
};
导出默认主页；