时间戳

首页 > 解决方案 > 如何根据状态选择对哪个数组执行操作？

javascript - 如何根据状态选择对哪个数组执行操作？

问题描述

我正在做一些可怕的事情来选择要映射的数组，具体取决于 shownAppointmens 的长度是否为 0。

 {shownAppointments.length
        ? shownAppointments
            .flat()
            .map((appointment) => (
              <AppointmentCard
                appointment={appointment}
              />
            ))
        : blockedDates
            .flat()
            .map((appointment) => (
              <AppointmentCard
                appointment={appointment}
              />
            ))}

我想知道是否可以简化它，选择showedAppointments 或blockedDates 并且不重复flat()它之后的任何内容。类似的东西

(shownAppointments ? shownAppointments : blockedDates).flat()

标签： javascriptreactjs

解决方案

例子

您可以将要渲染的数组的逻辑分离到一个单独的常量中，并在该常量上使用您需要的所有链接方法。

const hasAppointments = !!shownAppointments.length;

const list = hasAppointments ? [...showAppointments] : [...blockedDates]

list
   .flat()
   .map((appointment) => (
       <AppointmentCard
         appointment={appointment}
       />
    ))

推荐阅读