React option
본문 바로가기

Frontend/React

React option

import { useState } from "react";
import "./styles.css";

export default function App() {
  const selectList = ["select", "sample1", "sample2"];
  const [options, setOptions] = useState([]);
  const onChange = (e) => {
    if (!options.includes(e.target.value) && e.target.value !== "select") {
      setOptions((options) => [...options, e.target.value]);
    }
  };
  return (
    <div className="App">
      <select onChange={onChange}>
        {selectList.map((item) => (
          <option value={item} key={item}>
            {item}
          </option>
        ))}
      </select>
      {options.map((each, i) => {
        return <div key={i}>{each}</div>;
      })}
    </div>
  );
}
반응형