将焦点设置在 div 元素上的问题

Question

我正在尝试将焦点设置在div 元素上，以便我的工具提示模式可以滚动，而无需将鼠标悬停在该元素上，问题是我的重新图表工具提示数据过多，并且溢出到下一个图表上，下一个图形工具提示溢出页面。 我的想法是在工具提示上设置最大高度并允许其滚动。

这是我尝试过的。

<div
ref={ this.setFocus }
onFocus={ this.handleFocus }
className="custom-tooltip"
styleName="custom-tooltip"
>

和我的设置焦点功能

setFocus = (div) => {
if(div !== null && this.props.active) {
const myDiv = ReactDOM.findDOMNode(div) as HTMLDivElement;
return myDiv.focus();
}
}

我的 onFocus 函数永远不会被触发。

Answer 1

如果不使用此元素，则无法聚焦非表单元素。使用表单元素作为焦点(input，textarea(，或者您可以将第三方contenteditable反应组件附加到您的项目中，例如：react-contenteditable，react-content-editable或将您自己的contenteditable组件附加到您的prject中。