首页 > 解决方案 > 如何在索环反应js中调整选择组件的大小?

问题描述

我正在前端创建一个表单,其中我使用 texInput、单选按钮、选择组件。所有的 texInput,单选按钮组件都是按照分配的一个大小,但是选择组件的大小非常小,请帮我解决与每个 textinput 组件大小相同的选择组件

在此处输入图像描述

标签: reactjsgrommet

解决方案


put your form in a container and override the css of the select component :
css----------------
    .yourClassName{
        width: 100%!important;
    }
html-----------------------
    <Container>
      <Col md={{ span: 6, offset: 3 }}>
      <Form onSubmit={this.onSubmitForm}>
                  <Form.Row>
                    <Col md={{ span: 3 }}>
                      <Form.Group as={Row} controlId="Email">
                        <Form.Label>Email Address</Form.Label>
                        <Form.Control type="email" placeholder="Enter Email" name="Email" 
                           value={this.state.Email} onChange={this.handleChange} />
                      </Form.Group>
                    </Col>
                    <Col md={{ span: 3}}>
                      <Form.Group as={Row} controlId="Name">
                        <Form.Label>Name</Form.Label>
                        <Form.Control type="text" placeholder="Enter Name" name="Name" 
                          value={this.state.Name} onChange={this.handleChange} />
                      </Form.Group>
                    </Col>
         </Form.Row>
         <Form>
      </Col>
    </Container>

推荐阅读