可以将大变量传递到React状态吗？

Question

我有一个包含“配置文件”的数组，如下所示。这存储在导出的变量中，然后我想在我的组件中呈现它们。

const people = [
  {
    name : "Chuck",
    image : "./chuck.png",
    skill : "Bowling"
  },
  {
    name : "Arno",
    image : './arno.png',
    skill : "backflips"
  }
]
export default people;

我导入变量（请注意，它包含数百个数据点），并且在我的组件构造函数中，我使用以下代码，

constructor(props) {
    super(props)
    this.state = { data : people }

为了渲染这些，然后使用map将它们映射到卡片组件中

render() {
    let cards = this.state.data.map(function(elem, index) {
      return (
        <Card
          name = {elem.name}
          image = {elem.image}
          skills = {elem.skill}
          key = {elem.name}
          zIndex = {1000-`${index}`}
          />
      )
    })
return (
        <Card {pass in props (name, image, skills) to child Card component} />

我的问题是，这是不好的做法吗？一切正常。该应用程序类似于约会应用程序用户界面，其中弹出第一张卡片或数组中的元素，并向我们显示下一张卡片。您还将如何传递大型数组以使用和渲染组件中的元素？

我希望清楚我在这里做什么。谢谢

Answer 1

是，如果您将大变量传递到反应状态，没问题。

Answer 2

我认为，如果变量最多包含500-600项内容，就可以了。除此之外，我认为您应该将数据分成多个块并相应地映射数据并实现分页或无限滚动