Сопоставить массив, созданный из переменной, для визуализации указанного количества элементов в Grommet - PullRequest
0 голосов
/ 22 марта 2019

У меня есть текстовое поле, в котором пользователь вводит число, которое хранится в состоянии value.
Теперь я хочу создать массив [0, 1, 2, ..., value].
Этот массив будет использоваться для создания (value + 1) количества блоков / делений с соответствующими им идентификаторами.

Теперь я попробовал это

{(value) && 
  ([...Array(value).keys()].map(id => (
    <NodeBox id={id} >
      <h3>{id}</h3>
    </NodeBox>
  )))
}

Но он создал только один блок с текстом h3 '0'. У меня есть состояние, NodeBox, все определено правильно. Кажется, с этим проблем нет.


Если я сделаю это

{(value) && 
  ([0, 1, 2, 3].map(id => (
    <NodeBox id={id} >
       <h3>{id}</h3>
    </NodeBox>
  )))
}

Я получаю результаты, как и ожидалось. Я получаю 4 ящика с соответствующим номером.

1 Ответ

0 голосов
/ 22 марта 2019

Я думаю, что значение - это строка, а не число.Когда вы используете new Array() или Array.from (), вы смотрите на длину чего-то вместо фактического значения.Так что я думаю, что value - это строка, представляющая число меньше 10, которое даст ей длину 1, соответствующую вашему выводу.

Поэтому я бы использовал Array.from({ length: value }).map(( id, index ) => (<NodeBox id={index} >), чтобы не имело значения, если значениестрока или число

...