Ошибка: item.label.substr не является функцией при доступе к значениям из массива с помощью выпадающего списка React native

#reactjs #react-native #react-native-android #react-native-ios

Вопрос:

Я использую средство выбора выпадающего списка react native для отображения списка данных из массива объектов, который выглядит следующим образом

    "children":[
      {
         "name":"Amit",
         "id":"08941174-9a39-477f-b900-f3affbb43758",
      },
      {    
         "name":"Pranu",
         "id":"c86161ed-690a-4de1-8999-c4a832d786be",
      },
      {
         "name":"Testa",
         "id":"6642bc82-84f9-4298-8000-37a06df298ac", 
      }
   ],

Я написал компонент следующим образом:

  {userObject amp;amp;
          userObject != '' amp;amp;
          userObject != null amp;amp;
          userObject != undefined amp;amp;
          userObject.length > 1 amp;amp; (
            <DropDownPicker
              items={[
                {
                  label: userObject.map((name) => {
                    return name.name;
                  }),
                  value: userObject.map((id) => {
                    return id.id;
                  }),
                },
              ]}

            />
          )}

Но когда я пытаюсь выполнить вышеуказанное, я получаю сообщение об ошибке, поскольку item.label.substr не работает. Однако, когда я консолью, я получаю именно то, что хочу, кто-нибудь, пожалуйста, дайте мне знать, где я ошибаюсь? и что я должен сделать, чтобы получить данные внутри моего средства выбора выпадающего списка?

Любые предложения будут оценены.

Ответ №1:

items props ожидает массив со свойством label и value . вот правильное отображение.

 <DropDownPicker
    items={
        userObject.map((item) => {
            return
            {
                label: item.name,
                value: item.id
            })
    }
/>

Ответ №2:

Обновленный ответ

 var userObject = [....];

const updatedUserObject = userObject.map(({name: label, id: value})=>({value, label}));

<DropDownPicker
   items={updatedUserObject}
   .....
/>