我有以下几点:
class MyTextArea extends React.Component {
handleClick = () => {
this.focus();
}
focus = () => this.ref.focus;
handleRef = (component) => {
this.ref = component;
};
render() {
return (
<div className="magicHelper" onClick={this.handleClick}>
<textarea></textarea>
</div>
);
}
}
我的CSS:
.magicHelper {
width: 100%;
height: 100%;
}
textarea {
line-height: 32px;
}
我需要这个，因为我需要文本区域的占位符在页面中水平和垂直居中.鉴于文本区域不能垂直居中，我需要保持文本区域的高度较短.因此，当用户在textarea之外单击时，我需要这样做，因为他们认为他们在单击textarea，textarea会自动聚焦.
这会导致ESLint错误:
"Visible, non-interactive elements with click handlers must have at least one keyboard listener"
如何更新以上内容以通过eslint？