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?

do you want to change json? or json must be same as yours?

PPL
– PPL

2018-03-19 05:10:13 +00:00
Commented Mar 19, 2018 at 5:10 — PPL
– PPL, Commented Mar 19, 2018 at 5:10
@PPL both of them is ok, at least the screen works well

flix
– flix

2018-03-19 06:08:31 +00:00
Commented Mar 19, 2018 at 6:08 — flix
– flix, Commented Mar 19, 2018 at 6:08
Please find updated answer

PPL
– PPL

2018-03-19 06:19:05 +00:00
Commented Mar 19, 2018 at 6:19 — PPL
– PPL, Commented Mar 19, 2018 at 6:19

PPL · Accepted Answer · 2018-03-19 06:18:32Z

1

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.

edited Mar 19, 2018 at 6:18

answered Mar 19, 2018 at 6:12

PPL

6,5551 gold badge13 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Santosh Sharma · Accepted Answer · 2018-03-19 06:45:15Z

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
    }
  ]
}

edited Mar 19, 2018 at 6:45

answered Mar 19, 2018 at 5:08

Santosh Sharma

2,2581 gold badge19 silver badges30 bronze badges

1 Comment

flix Over a year ago

your json suggest just displaying latest value,

Collectives™ on Stack Overflow

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

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related