const replayInputRef = useRef(null)
<textarea
className={styles['com-btm-reply-text']}
id='re_input'
ref={replayInputRef}
onKeyDown={replayInputText}
placeholder="Enter,Shift+Enter"
autoComplete="off"
autoFocus={true} >
</textarea>
// @ts-ignore
const replayInputText = (e) => {
const replayInputRefCurrent = replayInputRef.current as unknown as HTMLDivElement as any
const replayText = replayInputRefCurrent.value
if (!e.shiftKey && e.keyCode === 13) {
e.cancelBubble = true;
e.stopPropagation();
e.preventDefault();
setOnEnter('onEnter')
replayInputRefCurrent.value = ''
setList([
...list,
{
id: list.length + 1,
useId: 'User_10',
time: '2022-10-10 08:00:00',
solve: 'solved',
content: replayText
}
])
}
}
In tsx, if you don’t use any, use this second method
// @ts-ignore
const replayInputText = (e) => {
let replayInputRefCurrent = (document.getElementById('re_input') as HTMLInputElement).value;
if (!e.shiftKey && e.keyCode === 13) {
e.cancelBubble = true;
e.stopPropagation();
e.preventDefault();
setOnEnter('onEnter');
(document.getElementById('re_input') as HTMLInputElement).value = ''
setList([
...list,
{
id: list.length + 1,
useId: 'User_10',
time: '2022-10-10 08:00:00',
solve: 'solved',
content: replayInputRefCurrent
}
])
}
}
IN TSX
const replayInputText = (e: React.KeyboardEvent) => {
const replayInputRefCurrent = (document.getElementById('re_input') as HTMLInputElement).value
if (!e.shiftKey && e.key === 'Enter') {
// e.cancelBubble = true
e.stopPropagation()
e.preventDefault()
setOnEnter('onEnter')
; (document.getElementById('re_input') as HTMLInputElement).value = ''
setList([
...list,
{
id: list.length + 1,
useId: 'User_10',
time: '2022-10-10 08:00:00',
solve: 'solved',
content: replayInputRefCurrent
}
])
}
}