Ожидается возврат значения в конце функции arrow

все работает нормально, но у меня это предупреждение Expected to return a value at the end of arrow function array-callback-return, Я стараюсь использовать forEach вместо map, а потом <CommentItem /> даже не показывают. Как это исправить?

  return this.props.comments.map((comment) => {
  
      if (comment.hasComments === true) {
      
        return (
          <div key={comment.id}>
          
            <CommentItem className="MainComment"/>

              {this.props.comments.map(commentReply => {
              
                if (commentReply.replyTo === comment.id) { 
                  return (
                    <CommentItem className="SubComment"/>
                 ) // returnt
                } // if-statement
              }) // map-function
              } // map-function __begin
            
          </div> // comment.id
          
        ) // return
17
ecmascript-6 javascript react-redux reactjs redux

3 ответов

предупреждение указывает, что вы не возвращаете что-то в конце функции стрелки карты в каждом случае.

лучший подход к тому, что ты пытаешься сделать это с помощью .filter и .map, например:

this.props.comments
  .filter(commentReply => commentReply.replyTo === comment.id)
  .map((commentReply, idx) => <CommentItem key={idx} className="SubComment"/>);
26

A map() создает массив, поэтому return ожидается для всех путей кода (if / elses).

Если вы не хотите массив или возвращать данные, используйте forEach вместо.

17

проблема, кажется, в том, что вы не возвращаете что-то в том случае, если ваш первый if - case имеет значение false.

ошибка, которую вы получаете, гласит, что ваша функция стрелки (comment) => { не имеет оператора return. Хотя это когда ваш if - case является true, он ничего не возвращает, когда он false.

return this.props.comments.map((comment) => {
  if (comment.hasComments === true) {
    return (
      <div key={comment.id}>
        <CommentItem className="MainComment" />
        {this.props.comments.map(commentReply => {
          if (commentReply.replyTo === comment.id) { 
            return (
              <CommentItem className="SubComment"/>
            )
          }
        })
        }
      </div>
    )
  } else {
     //return something here.
  }
});

редактировать вы должны взглянуть на ответ Криса о том, как лучше реализовать то, что вы пытаетесь делать.

3