React 用input和datalist写的下拉框

xiaoxiao2021-02-28  75

效果如图所示:

输入会有提示:

代码如下:

class Suggest extends React.Component{ getValue(){ return this.refs.lowlevelinput.valaue; } render(){ const randomid=Math.random().toString(16).substring(2); return ( <div> <input list={randomid} defaultValue={this.props.defaultValue} ref='lowlevelinput' id={this.props.id} /> <datalist id={randomid}> {this.props.options.map((item,idx)=> <option value={item} key={idx}/> )}</datalist> </div> ); } } ReactDOM.render( <div> <Suggest options={['esd','feff','fsf','fdsg','ghg']}/> </div>, document.getElementById('app') );

转载请注明原文地址: https://www.6miu.com/read-77380.html

最新回复(0)