不可以多選，使用tags屬性的時候會支持多選，希望能夠保存自己輸入的內容，

網上找的答案說是用combobox跟tabIndex={0}這兩個屬性，試了下是不起作用的，我當前用的antd版本是3.15.0的，請問有遇到這問題的嗎

回答：

為什么不用AutoComplete?

回答：

真的要使用select組件的話，也可以不用改造組件實現，配合showSearch以及onSearch：

const {searchKeyWordDataType} = this.state;

style={{width: '300px'}}

placeholder="請輸入"

showSearch

onSearch={value => this.setDataType(value)}

>

{

searchKeyWordDataType ?

{searchKeyWordDataType}

: ''

}

int

string

setDataType(value) {

this.setState({

searchKeyWordDataType: value

});

}

回答：

我去看了一下antd 支持，支持輸入和篩選的話再多選模式下是支持的，也就是 mode="tag" 的方式是OK的。單選的情形需要您自己實現這個邏輯，用戶輸入時候如果不存在就提示用戶新建即可。

回答：

思路：如果下拉框的數據是固定的，且不需要搜索，那么可以自己寫一個組件(輸入框 + 下拉框)，輸入框覆蓋在下拉框上面就行。

代碼：

/*

* 支持編輯的下拉框(不可搜索)

* @Author: Eric

* @Date: 2019-01-30 16:09:13

* @Last Modified by: Eric

* @Last Modified time: 2019-04-28 16:08:32

*/

import React from 'react';

import classNames from 'classnames';

import { Select, Input } from 'antd';

class EditableSelect extends React.Component {

/*

鼠標離開輸入框后校驗是否有值及填充默認值

*/

onBlur = e => {

let value = e.target.value;

let {onChange, onBlur, default:defaultValue} = this.props;

if(value === '' && defaultValue){

onChange && this.props.onChange(defaultValue);

}

onBlur && onBlur(e);

}

render() {

let { children, value, inputValue, disabled=false} = this.props;

return (

{children}

className="ue-editable-select-input"

disabled={disabled}

value={value}

onChange={this.props.onChange}

onBlur={this.onBlur}/>

);

}

}

export default EditableSelect;

回答：

showSearch 仔細看文檔

Select

回答：

…,

總結

以上是生活随笔為你收集整理的html5 input select,【Web前端问题】select如何实现既可以像input那样支持输入，又可以从下拉中选择? antd...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。