JAVASCRIPT

react select error handle

import Select from "react-select";
import { useEffect, useState } from "react";
import "./App.css";

export default function App() {
  const [car, setCar] = useState(null);

  const carOptions = [
    {
      label: "Lamborghini",
      value: "1"
    },
    {
      label: "Ferrari",
      value: "2"
    }
  ];

  useEffect(() => {
    console.log("selected car --->", car);
  }, [car]);

  const borderStyle = {
    control: (base) => ({
      ...base,
      border: 0,
      boxShadow: "none"
    })
  };

  return (
    <div className="App">
      <div className={car === "1" ? "danger" : null}>
        <Select
          options={carOptions}
          onChange={({ value }) => setCar(value)}
          styles={borderStyle}
        />
      </div>
    </div>
  );
}