Как проверить данные из массива, переданного через реквизит в реакции?

Question

У меня есть компонент, который принимает массив в качестве опоры

<Component runners={['1','2']}/>

В этом функциональном компоненте я хочу отобразить элемент для каждого значения в массиве. Моя логика такова:

const { runners } = props

if(runners.includes('1')) {
  return(<ElementOne/>)
}

if(runners.includes('2')) {
  return(<ElementTwo/>)
}

и т. Д. *

includes метод выдает ошибку runners.includes is not a function. То же самое для indexOf. Поэтому я проверяю typeOf runners, который возвращает object. Тогда я вывожу JSON.stringify(runners). И он возвращает «[1,2]».

Я пытаюсь выполнить вышеупомянутые условия с помощью методов hasOwnProperty и in, и все они возвращают false.

Есть идеи, что может сработать здесь?

Answer 1

Также добавьте ReactDOM.render (, document.getElementById ('root'));в вашем index.js, откуда компоненты рендеринга реагируют в основном.

runners -> идет как значение props для функционального компонента с именем Prctc (здесь), и вы можете использовать значения props, используя {props. runners}, так как это массив, я итерировал его и проверил предоставленное условие. Теперь вы можете вернуть что-либо во включающий тег.

Answer 2

Проблема в том, что prop является своего рода особым словом в react

Пока я не получу точный код, я не могу быть уверен, но, учитывая, что это функциональный компонент, который, вероятно, имеет prop в качестве аргумента решение -

prop.prop.includes(2)

внешняя опора - это аргумент функции, внутренняя опора - это фактический ключ, который вы передали Component