css - 我需要访问 InputGroup BlueprintJs react 组件中的输入

Question

BluePrintJS React InputGroup 组件非常适合现代用户界面。但不幸的是，React 组件不允许访问里面的 <input> 元素。

我需要访问输入元素有两个主要原因：

如果我的表单中有 50 个 InputGroup，我不想编写 50 个 OnChange() 回调。当用户完成所有输入时，我想获取所有 InputGroup.value()，这是不可能的（由于 HTMLInputElement.value 可以使用常规输入元素，但 InputGroup 不允许访问内部输入）
在表单显示时，我需要关注第一个字段。InputGroup 没有函数 focus()，而 HTMLInputElement 有一个。

简而言之， InputGroup 中缺少 2 个函数： GetValue() 和 Focus() ，我看不出它们为什么会丢失。任何建议将不胜感激。非常感谢。

score 5 · Accepted Answer

我找到了获取输入的方法！和：

inputRef={(input:HTMLInputElement) => {
    this.logininput=input;
}}

（第一次没看到）。

现在我有了输入对象，我可以将焦点设置在“didmount”，我可以通过 logininput.value 获取值。

谢谢

score 0 · Accepted Answer

略有不同的变化，但这也有效：

inputRef:(input:HTMLInputElement | null) => {
    // your code here
    return input;
}
}}

请注意，当我单击选择上的子控件时，代码会在您仅渲染组件时运行，具体取决于您的使用情况。

就我而言，我只是想修改一个适用于选择文本搜索的输入。

2 回答 2