使用onPaste与react select

Question

我正试着让onPaste使用react select。似乎，不可能利用这一事件。

基本上，我只是在<Select/>：onPaste={(e) => this.doPasteMagic(e)}中这样做

但它从未被发射过。我是遗漏了什么，还是有其他方法来区分打字和粘贴？

我已经看到了一些关于使用onChange的建议，但对我来说，这似乎也很脏。

Answer 1

我一直在摆弄这个。我发现这并不是“反应-选择”的主要特征之一，这是相当令人惊讶的。总之，我找到了一个解决办法：

<div style={{height: '100%', width: '100%' }} onPaste={(e) => console.log(e)}>
    <Select .../>
</div>

这似乎起到了作用，并在正确的时间触发了正确的事件。

Answer 2

您可以创建自定义输入字段并将onPaste事件处理程序附加到该字段。

import { components } from 'react-select'
const CustomInput = props => (
  <components.Input
    {...props}
    onPaste={myOnPasteHandler} />
)

然后通过“components”支柱将其传递给Select：

import Select from 'react-select'
import CustomInput from './CustomInput'
const MySelectComponent = props => (
  <Select 
    // ...
    components={{ Input: CustomInput }} />
)