Get selected value from react js functional component

 

// App.js

import React, { useState } from "react";

import { Dropdown, Option } from "./Dropdown";

export default function App() {

  const [optionValue, setOptionValue] = useState("");

  const handleSelect = (e) => {

    console.log(e.target.value);

    setOptionValue(e.target.value);

  };

  return (

    <div>

      <h1>Which service are you interested in?</h1>

      <Dropdown

        formLabel="Choose a service"

        buttonText="Send form"

        onChange={handleSelect}

        action="https://jsonplaceholder.typicode.com/posts"

      >

        <Option selected value="Click to see options" />

        <Option value="Option 1" />

        <Option value="Option 2" />

        <Option value="Option 3" />

      </Dropdown>

      <p>You selected {optionValue} </p>

    </div>

  );

}