我正在使用react-select和react-bootstrap,遇到了以下问题。我创建了一个bootstrap卡片,在其中放置了一个react-select组件,但问题是当我打开react-select菜单时,它没有完全显示出来。我尝试过更改z-index值和将位置设置为relative,但仍然没有改变。
这是我的问题截图:Image
import React from "react";
import Form from "react-bootstrap/Form";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
import MonthSelect from "../../../selects/MonthSelect";
import Container from "react-bootstrap/Container";
import Accordion from "react-bootstrap/Accordion";
import Card from "react-bootstrap/Card";
import Button from "react-bootstrap/Button";
const FeeSearch = props => {
const { register } = props;
return (
<>
<Accordion>
<Card border="secondary">
<Card.Header style={{ padding: "5px" }}>
<Accordion.Toggle as={Button} variant="link">
<h6>Búsqueda</h6>
</Accordion.Toggle>
</Card.Header>
<Accordion.Collapse in={true}>
<Card.Body>
<Container fluid>
<Form.Group>
<Row>
<Col xs={3}>
<Form.Label>Mes</Form.Label>
<MonthSelect register={register} />
</Col>
</Row>
</Form.Group>
</Container>
</Card.Body>
</Accordion.Collapse>
</Card>
</Accordion>
</>
);
};
export default FeeSearch;