0

在我们的应用程序中，表单并非微不足道，因为表单是基于来自服务器的数据而不是平面结构构建的。

尽管如此，元素是（最终）按顺序放置的，我希望在所述表单的最后一个元素中按下制表符时发生一些事情。

表格看起来像：

function (props) {
    const {elementTree} = props;
    function onLastElemTabbed(e) {
       console.log("something magical happens")
    }

    return <form>
        <ComponentRenderer elementTree={elementTree}/>
    </form>
}

function ComponentRenderer(props) {
    const {elementTree} = props;
    return <>
        elementTree.map((elem, idx) => {
            if (elem.type === 'input') {
                return <input/>;
            } else if (elem.type === 'fieldset') {
                return <fieldset>
                    <ComponentRenderer elementTree={elem.subGroup}/>
                </fieldset>
            }
        }
    </>
}

我总是可以将函数传递给 ComponentRenderer，但这感觉真的很脏，因为它只是向下传递道具（在另一种类似的形式中，使用相同的渲染器，但是最后一个元素按下的选项卡并不重要）。

是否有类似于表单onSubmit功能的方法来通知用户已完成所有字段？

4

0 回答 0