一浆兰、去除Antd的Button組件兩個漢字中間的空格
import { Button, ConfigProvider } from 'antd';
<ConfigProvider autoInsertSpaceInButton = { false }>
<Button type="primary">
空格
</Button>
</ConfigProvider>
二雨饺、去掉input聚焦時的藍色邊框
.ant-input:focus{
box-shadow:none;
}
三荐吉、去掉點擊button時的動畫
.ant-btn::after {
border: 0 none;
opacity: 0;
animation:none 0 ease 0 1 normal;
}
四、替換搜索框的icon
.anticon-search{
width: xxpx;
height: xxpx;
background-image: url(xx/xx.png);
background-size: cover;
}
.anticon-search>svg{
width: 0;
height: 0;
}
五蝗拿、修改樹形控件選中項的背景色
.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
background-color: #bae7ff;
}
六晾捏、解決react里input輸入時顯示[object Object]
onChange={e => SetInputValue(e.target.value)}
七、ant design的氣泡卡片組件Popover的彈窗里設(shè)置輸入框
從content屬性入手哀托，content屬性值設(shè)置為包含input的組件（該組件里不要使用Input組件惦辛，直接使用input，否則崩潰）
八仓手、設(shè)置input的寬度隨輸入內(nèi)容長度的變化而變化：
設(shè)置一個兄弟節(jié)點span,span顯示的內(nèi)容綁定input的value,通過定位讓span隱藏在input下
<div className="input-wrapper">
<span id="spanNode">{inputValue}</span>
<input
id="inputNode"
type ="text"
placeholder="the Sight_notes"
value={inputValue}
onChange={e => SetInputValue(e.target.value)}
/>
</div>
.input-wrapper{
position: relative;
min-width:150px;
margin-right: 10px;
span{
display:block;
min-width:100px;
height:32px;
line-height:32px;
font-size:14px;
padding-right: 10px;
}
input{
border:none;
outline:none;
box-shadow:none;
width:100%;
height:32px;
line-height:32px;
font-size:14px;
position: absolute;
top: 0px;
left: 0px;
}
}
九裙品、如何讓antd的Modal組件的確認和取消不顯示
<Modal
style={modelStyle} width="800px"
title="xxx"
visible={isModalVisible}
footer={null}
onOk={handleOk}
onCancel={handleCancel}>
</Modal>
十、如何改變Icon的大小和顏色
<CaretUpOutlined style={{fontSize:"10px",color:"#006BBF"}}/>
