结果为零的Reactjs过滤器

Question

当映射数组中没有项目显示时，我希望页面上的文本发生变化。 我正在显示一个问题列表，但如果一个问题是“已回答”（已回答的布尔值：true），则它不会被映射。

我正在尝试找出确定数组中的每个项目是否都回答的最佳方法：true，然后相应地更改页面上的文本。当我需要一个检查没有返回结果的函数时，是否可以为此使用过滤器？

页面左侧显示一个列表，右侧显示文本“请点击一个问题”。当一个问题被选中时，它会将“请点击一个问题”替换为有关所选问题的信息。但是当没有问题时，我希望“请点击一个问题”显示“目前没有要回答的问题”之类的内容。

this.state = {
      questions: [],
      currentQuestion: null,
      currentIndex: -1,
      searchQuestion: "",
      wanttodelete: false
};

{questions &&
              questions.map((question, index) => (
                <div key={index}>
                  {!question.answered &&
                <li
                  className={
                    "list-group-item " +
                    (index === currentIndex ? "active" : "")
                  }
                  onClick={() => this.setActiveQuestion(question, index)}
                  key={index}
                >
                  <p>
                  {question.question}
                  </p> 
                </li>
                }
                </div>
))}
</ul>
        </div>
        <div className="col-lg-8 question-area">
          {currentQuestion ? (
            <div>
              <h4>
              <FormattedMessage 
                id="question-list.questionHeader"
                defaultMessage="Question"
                description="Question header"/>
              </h4>
              <div>
                <label>
                  <strong>Question:</strong>
                </label>{" "}
                {currentQuestion.question}
              </div>
              <div>
                <label>
                  <strong>Category:</strong>
                </label>{" "}
                {currentQuestion.categoryId}
              </div>
              <div>
                <label>
                  <strong>Status:</strong>
                </label>{" "}
                {currentQuestion.answered ? "Answered" : "Awaiting answer"}
              </div>

              <Link
                to={"/questions/" + currentQuestion.id}
                className="badge badge-warning"
              >
                Answer this question
              </Link>
            </div>
          ) : (
            <div>
              <p>Please click on a Question...</p>
            </div>
          )}
        </div>
        </div>
      </div>
      </div>
    );
  }
}

Answer 1

const nothingToAnswer = questions.every(question => question.answered);