how to change material ui select element

Viewed 28

I'm React beginner, here i'm using material ui select element, 'selectPolygon' comes when i click a polygon then it changes select value to it.

When user comes to the page and nothing clicked yet, select element value is 'Polygo'.

Select value can be changed either from dropdown or clicking a polygon, but when user changes select value from dropdown and after it clicks a polygon it wont change select value, why ? English is not my mother language so could be mistakes.

  import {Select, MenuItem,} from "@material-ui/core";


  const [change, setChange] = useState("") ;


   const handleChange = (event) => {
      setChange(event.target.value);
    };


                  <Select
                    value={change}
                    renderValue={
                      change
                        ? undefined
                        : () => (
                            <div className={classes.placeholder}>
                              {" "}
                              {selectPolygon ? selectPolygon : "Polygo"}
                            </div>
                          )
                    }
                    onChange={handleChange}
                  >

                    {graph?.links?.map((option: any) => {
                

                  return (
                    <MenuItem
                      className={classes.menuItemm}
                      key={option.id}
                      value={option}
                    >
                      {
                        graph?.nodes.find(
                          (id: any) => id?.id === option?.target
                        )?.name
                      }
                 
                    </MenuItem>
                  );
                })}
               
                  </Select>

0 Answers
Related