How to fetching data JSON using react-native-dropdown?

Question

I want to fetching data from JSON using Dropdown lib, but I can't display these JSON.

Here's the code I have tried:

this.state = {"diagnosis": {
        "type": [
          "Oncology",
          "Hip And Knee"
        ],
        "kode": [
          "123",
          "321",
          "3232",
          "1231"
        ],
        "PrimaryCat": [
          "contoh1",
          "contoh2",
          "contoh3"
        ],
        "Location": [
          "jakarta",
          "bogor",
          "depok",
          "tangerang",
          "bekasi"
        ],
        "Encountrace": [
          "kga",
          "tau",
          "isi",
          "menunya"
        ],
        "fracture": [
          "ini",
          "juga",
          "kaga",
          "tau",
          "isinya"
        ],
        "healing": [
          "yang",
          "pasti",
          "penyembuhan"
        ]
      }}

      render() {
    let data = [{
      value: 'Banana',
    }, {
      value: 'Mango',
    }, {
      value: 'Pear',
    }];
    return (
        <View>
          <Dropdown
            label="testing"
            data={this.state.diagnosis.type}
          />
        </View>
    );
  }
}

with above code, the dropdown just displaying two rows of type, but the name of oncology or hip and knee doesn't show,

here's the example screen:

Am I doing something wrong?

Answer 1

try following.

{"diagnosis": {
  "type": [
    {
      value: "Oncology"
      },
    {
      value: "Hip And Knee
    }
  ],
  "kode": [
    {
      value: "123"
      },
    {
      value: "321"
      },
    {
      value: "3232"
      },
    {
      value: "1231
    }
  ],
  "PrimaryCat": [
    {
      value: "contoh1"
      },
    {
      value: "contoh2"
      },
    {
      value: "contoh3
    }
  ],
  "Location": [
    {
      value: "jakarta"
      },
    {
      value: "bogor"
      },
    {
      value: "depok"
      },
    {
      value: "tangerang"
      },
    {
      value: "bekasi
    }
  ],
  "Encountrace": [
    {
      value: "kga"
      },
    {
      value: "tau"
      },
    {
      value: "isi"
      },
    {
      value: "menunya
    }
  ],
  "fracture": [
    {
      value: "ini"
      },
    {
      value: "juga"
      },
    {
      value: "kaga"
      },
    {
      value: "tau"
      },
    {
      value: "isinya
    }
  ],
  "healing": [
    {
      value: "yang"
      },
    {
      value: "pasti"
      },
    {
      value: "penyembuhan
    }
  ]
}

Answer 2

This will work if you change your json in following format,

this.state = {"diagnosis": {
  "type": [
    {
      value: "Oncology",
    }, {
      value: "Hip And Knee"
    }
  ],

rest of the formats will be as above.

If you do not want to change the format of your json then, you have to do minor changes in your react-native-material-dropdown code,

Please go to this path,

react-native-material-dropdown->src->components->dropdown->index.js

Please do some changes in index.js, change your valueExtractor function like this way,

valueExtractor: ( value = {}, index) => value,

Hope it helps to you.