Реагировать на сопоставление одного и того же массива, но с разным выводом - PullRequest
Новая
       6

Реагировать на сопоставление одного и того же массива, но с разным выводом

0 голосов
/ 08 января 2019

У меня есть случай, когда мне нужно отобразить один и тот же массив дважды в моем методе рендеринга, чтобы отобразить различные свойства объектов в массиве. Итак, это так: 

   <Row>
      <Column xs="12" md="6">
        <Row>
          <Column xs="12">
            <Undertekst>
              <FormattedMessage id="InfoPanel.PaymentDates" />
            </Undertekst>
          </Column>
        </Row>
        {getPeriods(payment.periods, periodsDates)}
      </Column>
      <Column xs="12" md="6">
        <Row>
          <Column xs="12">
            <Undertekst>
              <FormattedMessage id="InfoPanel.PaymentAmount" />
            </Undertekst>
          </Column>
        </Row>
        {getPeriods(payment.periods, amount)}
      </Column>
    </Row>

Итак, поскольку мне нужно отобразить один и тот же массив в двух местах, я создал функцию, которая принимает массив и функцию, которая будет отображать дочерний элемент из текущего объекта в массиве. 

const periodsDates = period => `${moment(period .from).format(DDMMYYYY_DATE_FORMAT)} - ${moment(period .to).format(DDMMYYYY_DATE_FORMAT)}`;
const amount= period => formatCurrency(period.amount);
const getPeriods = (periods, children) => periods.map(period => (
  <Row>
    <Column xs="12">
      <Normaltekst>
        {children(period )}
      </Normaltekst>
    </Column>
  </Row>
));

Интересно, так ли это? Или есть лучший способ решить эту проблему, может быть, с помощью карри, если это возможно?

1 Ответ

0 голосов
/ 08 января 2019

Вы можете создать новый компонент без сохранения состояния, скажем, вы называете его Периоды с двумя подпорками (периоды, данные). Таким образом, вы даже можете использовать его в другом месте.

...