Two children with same key Error

[meinhoonharsh]

If we pass an array as a value, It will produces Error name Warning: Encountered two children with same keys

Steps to Reproduce

• Pass an array of objects to options where key value of any object is an array, like this

  
  const options = [
      { label: "Albania", value: [1,2,2,3,34,4] },
      { label: "Argentina", value: 54 },
  ];

- Start your Server and open Console to see logs
- Click on the select and view logs

[meinhoonharsh]

@sanusart @voneiden @pattiereaves I want to work on this issue

[sanusart]

Feel free to do so

[WardenSlayer]

If we pass an array as a value, It will produces Error name Warning: Encountered two children with same keys

Steps to Reproduce

• Pass an array of objects to options where key value of any object is an array, like this

const options = [
        { label: "Albania", value: [1,2,2,3,34,4] },
        { label: "Argentina", value: 54 },
    ];

• Start your Server and open Console to see logs
• Click on the select and view logs

Hey, I had this same error occur and I pulled my hair out for a while. But then I figured it out. The options keyword is looking for an array of objects [{label,value},{label,value},...etc] to be passed into it. If you just pass in the objects {} you get the duplicate key error because even though the objects contain different data, they are being treated as the same. What I did to fix my issue was to use a {label,'tag'} which I later used the tag to find the actual object as part of the "onchange" call

[sanusart]

I guess. It would be easy to have the key converted to string. Hopefully will get to it during the weekend.

On Thu, Mar 24, 2022, 3:45 PM Ben Loll @.***> wrote:

If we pass an array as a value, It will produces Error name Warning: Encountered two children with same keys

[image: image] https://user-images.githubusercontent.com/64343449/155614151-7fd2517e-09a1-415a-b7f8-6701864493ab.png Steps to Reproduce

• Pass an array of objects to options where key value of any object is an array, like this

const options = [ { label: "Albania", value: [1,2,2,3,34,4] }, { label: "Argentina", value: 54 }, ];

• Start your Server and open Console to see logs
• Click on the select and view logs

Hey, I had this same error occur and I pulled my hair out for a while. But then I figured it out. The options keyword is looking for an array of objects [{label,value},{label,value},...etc] to be passed into it. If you just pass in the objects {} you get the duplicate key error because even though the objects contain different data, they are being treated as the same. What I did to fix my issue was to use a {label,'tag'} which I later used the tag to find the actual object as part of the "onchange" call

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