Question

我有一个分组的对象。然后我将对象交换为数组： const objectToArray = ["Since", Array(7)]。然后，我想映射该数组以获取它objectToArray[0]（显示图片）和objectToArray[1]（显示问题列表）。我想在下面显示类别照片和问题列表。

import { groupBy } from 'lodash';
import QuestionsListItem from './QuestionListItem';

const images = require.context('../../img', true);
const imagePath = (name) => images(name, true);

const QuestionsList = ({ questions }) => {
  const groupByList = groupBy(questions.questions, 'type');
  const objectToArray = Object.entries(groupByList);

  const questionListItem = objectToArray.map((array) => (
    <img src={imagePath(`./${array[0]}.png`)} alt="star" />,
    array[1].map((question) => (
      <QuestionsListItem
        key={question.id}
        question={question}
      />
    ))));


  return (
    <div>
      <ul>
        { questionListItem }
      </ul>
    </div>
  );
};

代码显示了一个错误： Line 14: Unexpected use of comma operator no-sequences就是<img src={imagePath(。/${array [0]}。png )} alt="star" />,

删除逗号时会出现错误

  Line 15:  Parsing error: Unexpected token, expected ","

  13 |   const questionListItem = objectToArray.map((array) => (
  14 |     <img src={imagePath(`./${array[0]}.png`)} alt="star" />
> 15 |     array[1].map((question) => (
     |     ^
  16 |       <QuestionsListItem
  17 |         key={question.id}
  18 |         question={question}

如何解决这个问题？在此先感谢：）

Answer 1

有种模糊的错误，但是现在的方式是，您将在同一级别返回多个节点，因此需要用一些东西包装它。

尝试一下：

const questionListItem = objectToArray.map(array => (
  <React.Fragment>
    <img src={imagePath(`./${array[0]}.png`)} alt="star" />
    array[1].map((question) => (
    <QuestionsListItem key={question.id} question={question} />)
  </React.Fragment>
));

地图功能React

1 个答案: