antd

问题 I created collapsible sidebar.In side the sidebar that content automatically taken ant design padding value(16px)at the top,right,bottom and left .I need to remove this automatic padding render() { return ( <div className="common-coll-bar"> <Collapse > <Panel header="Present Staffs" style={customPanelStyle}> <p style={{ height: 550, color: '#131D43', background: '#607B7E', padding: 0 , margin: 0 }}> {text}</p> </Panel> </Collapse> </div> ); } Can you help me? 回答1: You would have to manually

问题 I am working on project in ReactJS, Currently I am using ant-design for file uploading. I want to preview video when user select a video . I am new to reactjs and unable to complete my task. Could someone please help me how it would be possible to preview a video . I will share my code with you You may check my code . Thanks Code import React from 'react'; import styled from 'styled-components'; import 'antd/dist/antd.css'; import './styletwo.css'; import { Form, Upload, Button, Icon } from

问题 We have requirement where we need to show 'Hide/Show' columns feature on the header of table and also we want to provide different color to the header of table in ant design. Can anyone help me how can we do this? I did not find any control to do it as header rendering is completely internal to component. 回答1: You can use the <Table.Column title={<...any react node...>}> attribute in combination with ordinary CSS. 回答2: What I tried to resolve the background colour issue of header is overwrite

问题 We have requirement where we need to show 'Hide/Show' columns feature on the header of table and also we want to provide different color to the header of table in ant design. Can anyone help me how can we do this? I did not find any control to do it as header rendering is completely internal to component. 回答1: You can use the <Table.Column title={<...any react node...>}> attribute in combination with ordinary CSS. 回答2: What I tried to resolve the background colour issue of header is overwrite

问题 I'm using antd: ^3.5.4 I have a menu that contains items for user management. When not logged the menu has a menuItem with a Link to Login page When logged in, the menu has a SubMenu with several links including Log out I just make a simple test on my user connected to display the link or the submenu. I works well when all in the same file <Menu mode="horizontal"> <Menu.Item key="home"> <Link to={RoutesNames.HOMEPAGE}>Home</Link> </Menu.Item> {this.props.currentUserIsSignedIn ? ( <SubMenu key

问题 We are working on a React application (using Create React App without ejecting it) and we decided to use Ant as our base component library. Now that we are near the end of the project, we discover that the application will be integrated into a corporate portal (WebSphere) as a "portlet", so we inherit all the CSS files from the main page. Both frameworks seem to have their own reset styles, but they use different values. So far, I have not been able to find a LESS variable in Ant that can be

问题 Uninstalling antd from my meteor project drops the build time by 38-40s on average. The profiler shows that plugin less needs >38s to deal with antd's huge less archive: VELOCITY_DEBUG=1 VELOCITY_DEBUG_MIRROR=1 METEOR_PROFILE=1 meteor | grep less ... | other plugin less.......................................38,766 ms (2) ... this number drops to <1s (572ms) when i uninstall antd: | other plugin less..........................................572 ms (2) >30s is simply too long to wait for the

问题 I have used antd as react lib. And for form, I want to reuse some form fields and make those fields as sub component. In my example it's Address. My question is how to pass the getFieldDecorator to sub component Address, as form property has been decorated by Form.create. antd version: 2.11.0 react version: 15.5.4 Below is my example. Form component: import React from 'react'; import { Form, Input, Select } from 'antd'; import Address from '../common/Address' const FormItem = Form.Item; const

问题 I am working with the antd' select box. I tried to customise the content inside Option which holds the regular text with some JSX. It looks as follows: Here is also the small demo I prepared on sandbox: Since I have customised the content inside the Option , the moment I make a choice with the Select Box, it gets shown as: As you could see, the select box tries to show everything. Is there a way I could control how the select box looks just after the choice is made with the select box? I just

问题 I need to customize day name in AntD calendar. For Sunday, instead "Su" needs to show "Sun". Is there any way? Thanks. 回答1: I had to manually change each th and span content. you can change the code as per your need. styles.css .App { font-family: sans-serif; text-align: center; } /* sunday */ .ant-fullcalendar.ant-fullcalendar-full>div>table>thead> tr th:nth-child(1)>span{ display: none; } .ant-fullcalendar.ant-fullcalendar-full>div>table>thead> tr th:nth-child(1):after{ content: "Sun";