Javascript 如何同时映射两个阵列？

我有两个数组，一个带有URL，另一个带有内容。 它们看起来像这样：

const link = [ 'www.test0.com', 'www.test1.com', 'www.test2.com' ]
const content = [ 'this is test0 content', 'this is test1 content', 'this is test2 content' ]

<Reactplayer url"link0" />
<ControlLabel>content0</ControlLabel>

如何同时映射两个数组并在新创建的元素中使用它们的值

我需要使用我的reactplayer的url值和内容的值作为播放器下面的文本

所以它应该是这样的：

const link = [ 'www.test0.com', 'www.test1.com', 'www.test2.com' ]
const content = [ 'this is test0 content', 'this is test1 content', 'this is test2 content' ]

<Reactplayer url"link0" />
<ControlLabel>content0</ControlLabel>

内容0

---

这可能吗？还有什么更好的方法来建立这个

您最好将其作为：

const data = [
    { link: "www.test0.com", text: "this is test0 content" },
    { link: "www.test1.com", text: "this is test1 content" }
];

然后，您将呈现如下内容：

render() {
    var links = [];
    for (var i = 0; i < data.length; i++) {
        var item = data[i];
        links.push(<div><Reactplayer url={item.link}/><ControlLabel>{item.text}</ControlLabel></div>);
    }

    return (<div>{links}</div>);
}

render（）{
var-links=[]；
对于（变量i=0；i

---

请注意，这是未经测试的代码，因为我目前没有可以测试的JSX项目

使用

map

的第二个参数，即当前元素的索引，可以访问第二个数组的正确元素

const link = [ 'www.test0.com', 'www.test1.com', 'www.test2.com' ];
const content = [ 'this is test0 content', 'this is test1 content', 'this is test2 content' ]

const players = link.map((value, index) => {
  const linkContent = content[index];
  return (
    <div>
      <Reactplayer url="{value}" />
      <ControlLabel>{linkContent}</ControlLabel>
    </div>
  );
});

---

我想这样会更好。但我还没有弄明白如何以这种方式保存我的数据。实际上，我在这里提出了另一个问题：