Basic example is broken

[joshnoe]

Using the basic example from the web site, github page, and npm page does not display anything:

import React from "react";
import Select from "react-dropdown-select";

const options = [
  {
    id: 1,
    name: "Leanne Graham",
    username: "Bret",
    email: "[email protected]",
    address: {
      street: "Kulas Light",
      suite: "Apt. 556",
      city: "Gwenborough",
      zipcode: "92998-3874",
      geo: {
        lat: "-37.3159",
        lng: "81.1496"
      }
    },
    phone: "1-770-736-8031 x56442",
    website: "hildegard.org",
    company: {
      name: "Romaguera-Crona",
      catchPhrase: "Multi-layered client-server neural-net",
      bs: "harness real-time e-markets"
    }
  },
  {
    id: 2,
    disabled: true,
    name: "Ervin Howell",
    username: "Antonette",
    email: "[email protected]",
    address: {
      street: "Victor Plains",
      suite: "Suite 879",
      city: "Wisokyburgh",
      zipcode: "90566-7771",
      geo: {
        lat: "-43.9509",
        lng: "-34.4618"
      }
    },
    phone: "010-692-6593 x09125",
    website: "anastasia.net",
    company: {
      name: "Deckow-Crist",
      catchPhrase: "Proactive didactic contingency",
      bs: "synergize scalable supply-chains"
    }
  }
];

export const App = () => (
  <Select multi options={options} onChange={(values) => {}} />
);

[sanusart]

You need to have label and value fields in the data object. Or add this props to Select.

labelField: "username", valueField: "email",

On Mon, Oct 3, 2022, 2:57 AM Josh Noe @.***> wrote:

Using the basic example from the web site, github page, and npm page does not display anything:

import React from "react"; import Select from "react-dropdown-select";

const options = [ { id: 1, name: "Leanne Graham", username: "Bret", email: @.", address: { street: "Kulas Light", suite: "Apt. 556", city: "Gwenborough", zipcode: "92998-3874", geo: { lat: "-37.3159", lng: "81.1496" } }, phone: "1-770-736-8031 x56442", website: "hildegard.org", company: { name: "Romaguera-Crona", catchPhrase: "Multi-layered client-server neural-net", bs: "harness real-time e-markets" } }, { id: 2, disabled: true, name: "Ervin Howell", username: "Antonette", email: @.", address: { street: "Victor Plains", suite: "Suite 879", city: "Wisokyburgh", zipcode: "90566-7771", geo: { lat: "-43.9509", lng: "-34.4618" } }, phone: "010-692-6593 x09125", website: "anastasia.net", company: { name: "Deckow-Crist", catchPhrase: "Proactive didactic contingency", bs: "synergize scalable supply-chains" } } ];

export const App = () => ( <Select multi values={options} options={options} onChange={(values) => {}} /> );

— Reply to this email directly, view it on GitHub https://github.com/sanusart/react-dropdown-select/issues/244, or unsubscribe https://github.com/notifications/unsubscribe-auth/AACBLRUUG7GUODVEGC25LGTWBIOPTANCNFSM6AAAAAAQ3DZIFQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>

[joshnoe]

Thanks. Would you be open to a pull request if I updated the README to include this info?

[sanusart]

Off course

On Wed, Oct 5, 2022, 3:37 AM Josh Noe @.***> wrote:

Thanks. Would you be open to a pull request if I updated the README to include this info?

— Reply to this email directly, view it on GitHub https://github.com/sanusart/react-dropdown-select/issues/244#issuecomment-1267767747, or unsubscribe https://github.com/notifications/unsubscribe-auth/AACBLRUT4R57AFBKRM6YWK3WBTESZANCNFSM6AAAAAAQ3DZIFQ . You are receiving this because you commented.Message ID: @.***>