0

I am new to react, my problem is, I have one dropdown in which there are two options A and B, Example: As shown below this is my dropdown display options dynamically in my case options are A and B.

  <DropDown
    selectedData={Options}
  />

Custom DropDown:


  const onChange = (value) => {
    !isMulti && setToggle(!toggle);
    onChecked(value);
  }

const createOptions = () => {
    if (data && data.length > 0) {
      return data.map(({ value}, index) => {
        if (isMulti) {
          return (
            <div key={index}>
              <input type="checkbox"
                onChange={() => onChange(value)}
                checked={selectedOrNot(value)}
              />
            </div>
          )
        } else {
          return (
            <div key={index}
              onClick={() => onSelectionChange(value)}
            </div>
          );
        }
      });
    }
    else {
      return <div>No data found</div>
    }
  }

Also, I have JSON data which consists of two objects in it. for eg:

data: {
        A: {
            num1: "0.241",
            num2: "15.293",
        },
        B: {
            num1: "0.241",
            num2: "15.293",
        },
    }

So what I want is whenever users select A as an option from dropdown it will render A object eg: data.A. Similarly when users select B as an option it will render B object eg: data.B. Please help.

7
  • Did you create the Dropdown component ? What do you mean by render data A ?
    – Sid Ali
    Commented Apr 2, 2020 at 14:52
  • Yes @sidali i have created the drop-down. What I mean to say is i have show object A on Ui if users selects option A and if user selects B as an option i want toh data for object B in place of A.
    – Nitin
    Commented Apr 2, 2020 at 15:04
  • I think you will have to use a sort of onChange function, can edit your post and add you Dropdown component code
    – Sid Ali
    Commented Apr 2, 2020 at 15:43
  • Added the code for dropdown @sidali
    – Nitin
    Commented Apr 2, 2020 at 16:28
  • is your data an object? because you can only .map() an array of objects const data = [{num1: "...", num2: "..."}, {num1: "...", num2: "..."}]
    – teddybeard
    Commented Apr 2, 2020 at 19:38

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.