这是my form组件，如果这是项目表单列表的单个表单，则问题在于提交表单时未触发提交表单。问题发生在列表的所有形式上。此外，像onclick这样的其他事件也可以正常工作

// State vars
const [inputValue, setInputValue] = useState(value.body);

return (
    <form
        onSubmit={(e) => {
            e.preventDefault();
            // doesn't work!
        }}
        className="flex items-center space-x-3"
    >
        <Controls.TextInput
            inputRef={formInputRef}
            inputChange={(e) => {
                handleUpdate(value.id, e.target.value);
                setInputValue(e.target.value);
            }}
            value={inputValue}
            label={label}
        />

        <button type="submit" className="sr-only"></button>

        <div className="flex">
            {/* button for focus state */}
            <IconButton onClick={handleStartStopListening} color="primary" size="small">
                {listeningIcon}
            </IconButton>

            <IconButton onClick={handleDeleteItem} size="small">
                <TrashIcon className="h-6 cursor-pointer text-red-600 " />
            </IconButton>
        </div>
    </form>
);

}