Question

好的说我有3个这样的阵列：

import React from 'react';

const hello = ['hello', 'hi', 'sup'];
const bye = ['bye', 'goodbye', 'see ya'];
const names = ['john', 'bob', 'jill'];

然后让我们说我想映射每个数组：

const helloWorld = hello.map(helloCode => {
  return (
    <div>{helloCode}</div>
  );
});

const goodBye = bye.map(byeCode => {
  return (
    <div>{byeCode}</div>
  );
});

const allNames = names.map(nameCode => {
  return (
    <div>{nameCode}</div>
  );
});

现在假设我想要采用所有这三个映射函数并像这样映射它们：

const all = [helloWorld, byeWorld, allNames];

const Everything = all.map(allCode => {
    return (
        <div>{allCode}</div>
    );
});

我将如何做到这一点，因为这种方式似乎不起作用。我真的只需要回答答案。无论如何，如果有人可以帮我解决这个问题，将不胜感激。谢谢！

Answer 1

你可以像这样展平数组

const all = [helloWorld, byeWorld, allNames];
const flattenedArray = [].concat.apply([], all)
// or use array destructuring
// const flattenedArray = [...helloWorld, ...byeWorld, ...allNames]
const Everything = flattenedArray.map(allCode => {
    return (
        <div>{allCode}</div>
    );
});

Answer 2

您的all是一个数组数组。要将其转换为数组，请传播内部数组

const all = [...helloWorld, ...byeWorld, ...allNames]; //all  is now an array

const Everything = all.map(allCode => {
    return (
        <div>{allCode}</div>
    );
});

如何在另一个const React.js中映射映射的const

2 个答案: