如何修复“预期在箭头函数的末尾返回值"警告? [英] How do I fix "Expected to return a value at the end of arrow function" warning?

问题描述

一切正常，但是我收到此警告Expected to return a value at the end of arrow function array-callback-return.我尝试使用forEach而不是map，但是随后<CommentItem />甚至没有显示.我该如何解决?

Everything works fine, but I have this warning Expected to return a value at the end of arrow function array-callback-return. I tried using forEach instead of map, but then <CommentItem /> doesn't even show. How do I fix this?

  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"/>
                 ) // return
                } // if-statement
              }) // map-function
              } // map-function __begin
            
          </div> // comment.id
          
        ) // return

推荐答案

警告表明在每种情况下，您都不会在地图箭头功能的末尾返回任何内容.

The warning indicates that you're not returning something at the end of your map arrow function in every case.

一种更好的方法来完成您要完成的工作，首先使用.filter，然后使用.map，如下所示:

A better approach to what you're trying to accomplish is first using a .filter and then a .map, like this:

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

这篇关于如何修复“预期在箭头函数的末尾返回值"警告?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！