React-bootstrap“未找到”选项。

Question

尝试在注册表单中添加下拉菜单。

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

如果我这样留下它，那么我会遇到错误

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)

，但是如果我将“选项”排除在导入中，则会得到一个不确定的错误。 我在这里想念什么？

编辑1：我安装了react-bootstrap-select-dropdown，我不再遇到“选项”缺少“选项”的错误，但是页面不加载（白屏）。

Answer 1

使用资本“ O”的“选项”用于反应，但不用于ReactJ。需要使用小写'o'作为“选项”才能下拉以工作。

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