1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > input框监听输入法输入中文

input框监听输入法输入中文

时间:2022-12-11 01:50:07

相关推荐

input框监听输入法输入中文

input框监听输入法输入中文

需求input事件select为什么不能使用注意select的onChange和onSearch

需求

想要在input框中进行接口实时查询,但是在使用输入法输入的时候会有这种情况,即使添加防抖还会出现这种情况;这样我们就会用到compositionstartcompositionend

input事件

compositionstart当用户使用拼音输入法开始输入汉字时,这个事件就会被触发。compositionend当文本段落的组成完成或取消时,这个事件将被触发

const onChange = (e)=>{if(e.type==='compositionstart'){return // 如果刚监听输入 就直接return出去}if (e.type === 'compositionend') {// 执行你的方法}}

select为什么不能使用

那么问题又来了,为什么在select搜索中不能使用,没有效果呢?那是因为selec没有这两个事件,所以只能添加防抖了

开发中用到的是ant design pro组件库和umi框架

import { useRequest } from 'umi';const getbuyerList = useRequest(queryGetBuyerList, {manual: true,debounceInterval: 800, // 防抖在这里onSuccess: (val) => { }})<ProFormSelectname="buyerIds" label="关联公司" showSearchfieldProps={{mode: 'multiple', // 设置 Select 的模式onSearch:(params)=>{getbuyerList.run({ searchText:params })},notFoundContent:buyerListSearch ? <Spin size="small" /> : null // 当下拉列表为空时显示的内容,添加了antd的Spin}}options={buyerListSearch} //options集合返回下拉列表中所有元素的集合/>

注意select的onChange和onSearch

onchanage(e) 返回的是options发生改变的值onSearch(e) 返回的是你当前输入要查询的值

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。