Javascript 反应形式的动态选项值

我有一个组件，我在其中获取一些数据。该数据必须以表格形式显示，作为选项值的一部分。因此，我获取的数据将是选项

数据将来自以下组件：

import React from 'react';

import Layout from '../Layout/Layout';
import CmView from './CmView';


export default function CmContainer() {
    someState [/*with items*/]

    return (
        <div>
            <Layout title={'CM Info'}>
                <CmView/>
            </Layout>
        </div>
    )
}

选择位于另一个名为CmView的组件中：

import React from 'react'

export default function CmView() {
    return (
        <div>
            <form>
                <select>
                    <option>here comes an item</option>
                </select>
            </form>
        </div>
    )
}

---

问题是，传递数据的最佳方式是什么？我是在第一个组件中循环还是作为道具传递数据？我正在尝试实现容器视图模式，其中视图仅用于显示数据

您可以将数据作为数组传递，并在CmView组件中循环它

import React from 'react';

import Layout from '../Layout/Layout';
import CmView from './CmView';


export default function CmContainer() {
  someState [/*with items*/]

  return (
    <div>
      <Layout title={'CM Info'}>
         <CmView options={options} />
      </Layout>
    </div>
  )
 }

在这里循环：

import React from 'react'

export default function CmView({ options }) {
    return (
        <div>
            <form>
                <select>
                    {options.map(option => (<option>{option.name}</option>)}
                </select>
            </form>
        </div>
    )
}

---

对于容器/视图模式，您将获取并维护CmContainer中的状态，并将数据传递到CmView，在那里您将数据映射到选项中。谢谢你，这就是我想要的，没问题。请记住，这类问题可能会在本网站上被否决，因为它本身并不涉及编程问题。例如，您尝试了什么，哪些不起作用？您可以应用该模式，也可以不应用该模式，这两种方式都可以。我没有投你反对票，但其他人会投，而且已经投了。如果你找到了你想要的答案。我建议在这个问题被否决之前删除它。