强制下拉菜单始终位于底部

Question

我正在使用react-bootstrap最新版本（Bootstrap 4.3）。我想将下拉菜单设置为始终位于底部。但这没用。

根据Force Bootstrap dropdown menu to always display at the bottom and allow it go offscreen的答案，我试图设置数据显示以及数据翻转，但同时尝试都无效。

<Dropdown drop="down">
  <Dropdown.Toggle data-flip="false" data-display="static" id="dropdown-basic">
    Dropdown
  </Dropdown.Toggle>

  <Dropdown.Menu>
    <Form>
      <Form.Group controlId="exampleForm.ControlInput1">
        <Form.Label>Email address</Form.Label>
        <Form.Control type="email" placeholder="name@example.com" />
      </Form.Group>
      <Form.Group controlId="exampleForm.ControlSelect1">
        <Form.Label>Example select</Form.Label>
        <Form.Control as="select">
          <option>1</option>
          <option>2</option>
          <option>3</option>
          <option>4</option>
          <option>5</option>
        </Form.Control>
      </Form.Group>
      <Form.Group controlId="exampleForm.ControlSelect2">
        <Form.Label>Example multiple select</Form.Label>
        <Form.Control as="select" multiple>
          <option>1</option>
          <option>2</option>
          <option>3</option>
          <option>4</option>
          <option>5</option>
        </Form.Control>
      </Form.Group>
      <Form.Group controlId="exampleForm.ControlTextarea1">
        <Form.Label>Example textarea</Form.Label>
        <Form.Control as="textarea" rows="3" />
      </Form.Group>
    </Form>
  </Dropdown.Menu>
</Dropdown>

我可以看到在元素类为dropdown-menu的地方设置了数据显示。但是为什么它不起作用？调整窗口大小时，它会移到顶部。我不希望覆盖transform，因为下拉菜单的宽度将设置为动态宽度。