antd的 input有下拉_antd Select框可输入可下拉选择

本文介绍了如何在Ant Design(antd)中使用Select组件实现带有下拉选项的输入框。通过`onSearchSelect`、`onBlurSelect`等方法处理用户的选择和输入,并展示了一个例子,包括不同字号的选择。此外,还提到如何控制搜索下拉框的显示以及调整组件样式。
摘要由CSDN通过智能技术生成

textFontSizeChange = (value,index) => {

const {record} = this.state;

record[index]=value||'';

this.setState({record});

let { layerData, layerUpdateConfig} = this.props;

layerData.style.fontSize = value;

layerUpdateConfig(layerData.layerId, {style:layerData.style});

}

onSearchSelect = (value, index) => {

const {newValue} = this.state;

if (!!value) {

newValue[index] = value+'px'||'';

this.setState({newValue});

}

}

onBlurSelect = (index) => {

const {newValue} = this.state;

const value = newValue[index];

if (!!value) {

this.textFontSizeChange(value,index);

// 在onBlur后将对应的key删除,防止当从下拉框中选择后再次触发onBlur时经过此处恢复成原来的值

delete newValue[index]

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值