CODEWITHSUNDEEP
javascriptreactjsantd
putra irawan
putra irawan

Reputation: 872

How to place the data API into the Ant Design Cascader?

I have previously managed to place and retrieve data, but for the feature menu and dropdown ...the image below

enter image description here

well, the problem is how to retrieve or place data in the cascader? I take the data from the ant design example ... which I am confused about how to retrieve data from the API ... enter image description here

I don't understand how to take or place data from the API to Cascader in design https://ant.design/components/cascader/,

I share the code directly using codesanbox.io this url https://codesandbox.io/embed/distracted-hodgkin-8lmt6

Upvotes: 3

Views: 1215

Answers (1)

Dennis Vash
Dennis Vash

Reputation: 53934

Map allCategory id prop to value and name to label prop:

  render() {
    const options = this.state.allCategory.map(category => ({
      value: category.id,
      label: category.name
    }));

    return <Cascader options={options} />;
  }

Demo:

Edit Q-56619059-SO

Upvotes: 2

Related Questions