Blazor JSRuntime关注foreach中的元素

当我在我的“表单集”中创建一个新表单时，我希望关注新表单

用这段代码我得到了想要的结果，但我得到了一个“未处理的错误已经发生”。“重新加载”和控制台中的以下错误：

非常感谢

<EditForm Model="todos" OnValidSubmit="Save">
    <table>
        <thead>
            <tr>
                <th>TODO</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var todo in todos)
            {
                if (todos.IndexOf(todo) != todos.Count - 1)
                {
                    <tr>
                        <td><input @bind="@todo.Name" /></td>
                    </tr>
                }
                if (todos.IndexOf(todo) == todos.Count - 1)
                {
                    <tr>
                        <td><input @ref="element" @onkeydown="@((KeyboardEventArgs e) => Newline(e))" @bind="@todo.Name" /></td>
                    </tr>
                }
            }
        </tbody>
    </table>
    <button class="btn btn-success" type="submit">Save</button>
</EditForm>

site.js：

function setFocusOnElement(element) {
    element.focus();
}

---

尽管有错误信息，我相信这与渲染的时间有关。。。按如下方式调用InvokeVoidAsync：

ElementReference element;

 protected override async Task OnAfterRenderAsync(bool firstRender)
 {
        if (firstRender)
        {
            await JSRuntime.InvokeVoidAsync("exampleJsFunctions.focusElement", element);
         }
     }

_Host.cshtml：

<script src="_framework/blazor.server.js"></script>
<script>

    window.exampleJsFunctions =
    {
        focusElement: function (element) {
           element.focus();
        }
    };
</script>

window.exampleJsFunctions=
{
焦点元素：函数（元素）{
元素focus（）；
}
};

如果（！firstRender）成功了。非常感谢。你能更新你的答案让我接受吗？

<script src="_framework/blazor.server.js"></script>
<script>

    window.exampleJsFunctions =
    {
        focusElement: function (element) {
           element.focus();
        }
    };
</script>