标签：换行 标签 重置 添加 自动 antd

1. antd中<Row>里面的<Col>自动换行的办法。

    方法一：在需要换行的地方，添加一个空的<Col>标签。

                   如：<Col span={24}></Col>

     方法二：把需要进行换行的内容从From表单中取出来，用<Space>标签包裹，可实现自动换行。

                    如：原代码如下，想将重置按钮换行。

<Form>
  <Row>
    <Col>
      <Button type="primary">搜索</Button>
    </Col>
    <Col>
      <Button type={'default'}>重置</Button>
    </Col>
   </Row>
 </Form>

解决办法是：

<Form>
  <Row>
    <Col>
      <Button type="primary">搜索</Button>
    </Col>
   </Row>
 </Form>
<Space>
  <Col>
    <Button type={'default'}>重置</Button>
  </Col>
</Space>

 2. antd里面<Space>标签中自动换行的办法。

方法一：在<Space>标签中添加direction属性。

<Space direction='horizontal' style={{width:'100%'}}></Space>

方法二：在<Space>标签中，给需要换行的内容添加一个<div>进行包裹。

<Space>
  <div style={{display:'flex',flexDirection:'column'}}>
    <Button type="primary">搜索</Button>
  </div>
</Space> 

标签：换行,标签,重置,添加,自动,antd
来源： https://blog.csdn.net/weixin_47763287/article/details/121161917

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。