React-Bootstrap "Option was not found"

Question

Trying to add a dropdown menu in a signup form.

import React from 'react';
import { Form, Option } from 'react-bootstrap';

function Signup() {
  return (
                <Form>
                    <Form.Group className='mb-3' controlId='firstName'>
                        <Form.Label>First Name</Form.Label>
                        <Form.Control type='firstName' placeholder='First name' required />
                    </Form.Group>
                    <Form.Group className='mb-3' controlId='lastName'>
                        <Form.Label>Last Name</Form.Label>
                        <Form.Control type='firstName' placeholder='Last name' required />
                    </Form.Group>
                    <Form.Group className='mb-3' controlId='email'>
                        <Form.Label>Email</Form.Label>
                        <Form.Control type='email' placeholder='Email address' required />
                    </Form.Group>
                    <Form.Select aria-label='TeamSelect'>
                        <Option>Select your team</Option>
                        <Option value='1'>Team One</Option>
                        <Option value='2'>Team Two</Option>
                    </Form.Select>
                </Form>
  )
}

export default Signup

If I leave it as this then I get an error

ERROR in ./src/components/pages/Signup.js 156:43-49
export 'Option' (imported as 'Option') was not found in 'react-bootstrap/Form' (possible exports: default)

But If I leave 'Option' out of the import then I get an undefined error. What am I missing here?

EDIT 1: I installed react-bootstrap-select-dropdown and I no longer get an error that 'Option' is missing however the page doesn't load (white screen).

Answer 1

'Option' with a capital 'O' is used in React-Native but not in ReactJS. Need to use lowercase 'o' for 'option' to get dropdown to work.

          <Form.Select aria-label='TeamSelect'>
             <option>Select your team</Option>
             <option value='1'>Team One</Option>
             <option value='2'>Team Two</Option>
          </Form.Select>