Как недопустить рендер, если нет родителя?

Question

[Ilnar25]

Есть задача на исправление бага в коде. Суть приложения бронироваие комнаты в аэропортах и если нет родителя то нельзя забронировать только ребёнка. Задача: необходимо проставить условие в коде для запрета рендера строк с "kid" и "baby" если массив "grown" пуст.

renderPassangers() {
    const hall = this.props.hall;
    if (!hall.grownCount && !hall.babyCount && !hall.kidCount) return null;

    return (
      <div>
        <div>
          <h4 className="pb5">Данные пассажиров</h4>
          <small>Укажите имена пассажиров латинскими буквами, как в авиабилетах</small>
        </div>

        { this.renderMemberGroup('grown', 'Взрослый', !hall.kid.length && !hall.baby.length) }
        { this.renderMemberGroup('kid', 'Ребенок', !hall.baby.length) }
        { this.renderMemberGroup('baby', 'Младенец', false) }

        <hr className="hr"/>
      </div>
    );
  },

Answer 1

[Андрей Антропов]

Добавить третьим параметром условие типа `hall.grown.length > 0` если я неверно понял этот метод то достаточно будет это условие вынести перед методом рендеринга строки и объединить через тернарник

Answer 2

[Роман Александрович]

По моему лучший способ это использовать shouldComponentUpdate