javascript - 如何在ReactJS中获取onCut输入值

Question

我有一个组件UsernameInput，它是通过redux存储管理的。 我想在 onCut 事件触发时获取输入值。

import React from 'react'
import connect from 'react-redux'
import {validateUsername} from '../actions'

const UsernameInput = ({username, validateUsername}) => {
    
    return (

        <div className="form-group">
            <input type="text" className="form-control"
            onChange={e => validateUsername(e.target.value)}
            onPaste={e => validateUsername(e.clibboardData.getData('Text'))}
            onCut={e => validateUsername(e.currentTarget.value)}
            defaultValue={username}
            />
        </div>
    );
}

export default connect((state) => state.validateUsername, {validateUsername})(UsernameInput);

也就是说，如果输入的值为“blablabla”，并且在剪切整个文本后，应该使用空字符串调用 validateUsername 函数，如果输入的一半被剪切，那么它应该使用“blab”等参数进行调用。 onCut e.currentTarget.value 返回剪切前输入字段的值，但我希望它返回实际的输入值。

怎么做？

Answer 1

我找到了一个独特的解决方案。我只是捕获 onKeyUp 事件，而不是捕获 onChange、onPaste 和 onCut 事件:

<input type="text" className="form-control"
onKeyUp={e => validateUsername(e.currentTarget.value)}
defaultValue={username}
/>

它适用于所有事件。

reactjs