rc-time-picker 无法在移动设备上正确显示

Question

  <div>
    <Button onClick={() => this.setState({ show: true })}>Open</Button>
    <Modal
      show={this.state.show}
      onHide={() => this.setState({ show: false })}
      animation
    >
      <Modal.Header closeButton>
        <Modal.Title>Modal</Modal.Title>
      </Modal.Header>

      <Modal.Body>
        <TimePicker open getPopupContainer={triggerNode => triggerNode.parentNode}/>
        {[...Array(11).keys()].map(() => <div>Scroll down</div>)}
      </Modal.Body>
    </Modal>
  </div>

我正在使用 the rc-time-picker。

它在桌面上正确显示，即使 window 最小化。

但在手机上它看起来像这样（下拉框在输入框的左边）：

知道哪里出了问题吗？

Answer 1

我通过减少输入的宽度来破解它，但我多次选择尺寸。

Answer 2

与 Artems 类似的修复，我将违规输入的边框设置为 0px。对于任何尺寸的手机，这将在外观上摆脱它。

rc-time-picker 无法在移动设备上正确显示

rc-time-picker not displaying correctly on mobile

twitter-bootstrap

bootstrap-modal

reactjs

antd