带有选择下拉菜单的Blazor onchange事件 [英] Blazor onchange event with select dropdown

问题描述

所以我一直坚持试图让一个简单的onchange火灾时，选择下拉值的变化.像这样:

So I have been stuck trying to get a simple onchange to fire when a select dropdown value changes. Like so:

<select class="form-control d-flex" onchange="(dostuff())">
    @foreach (var template in templatestate.templates)
    {
        <option value=@template.Name>@template.Name</option>
    }
</select>

方法被调用:

void dostuff()
{
   Console.WriteLine("first spot is firing");
    _template = templatestate.templates.FirstOrDefault(x => x.Name == 
    _template.Name);
    Console.WriteLine("second spot is firing");
}

无论如何尝试重新定向，我得到的结果都是浏览器中的此错误.

The result I get it no matter how I try to reorient it is this error in the browser.

Uncaught Error: System.ArgumentException: There is no event handler with ID 0

我是否缺少明显的关键内容?因为我有一个按钮onclick事件，它在同一页面上也可以正常工作.

Is there something obvious and key that I am missing? Because I have a button onclick event that works just fine in the same page.

推荐答案

您的答案应该在cshtml中:

Your answer should be in the cshtml:

<select onchange=@DoStuff>
    @foreach (var template in templates)
    {
        <option value=@template>@template</option>
    }
</select>

然后使用您的@functions(使用剃须刀组件@code代替.请参见:

Then your @functions (in razor components @code instead. See: https://docs.microsoft.com/vi-vn/aspnet/core/mvc/views/razor?view=aspnetcore-3.0#functions) should look like:

@functions {
    List<string> templates = new List<string>() { "Maui", "Hawaii", "Niihau", "Kauai", "Kahoolawe" };
    string selectedString = "Maui";

    void DoStuff(ChangeEventArgs e)
    {
        selectedString = e.Value.ToString();
        Console.WriteLine("It is definitely: " + selectedString);
    }
}

您也可以只使用绑定...

You could also just use a bind...

<select bind="@selectedString"> 

但是onchange =:@ DoStuff允许您执行选择逻辑.

but onchange=:@DoStuff allows you to perform logic on selection.

请注意，在预览6中，语法似乎是@onchange ="@ DoStuff".具有未来前景的@ onchange ＝"DoStuff". 这是一些更改的链接:

Note that in Preview 6, it appears that syntax will be @onchange="@DoStuff" with the future promising @onchange="DoStuff". Here's a link to some changes: Blazor Preview 6

这篇关于带有选择下拉菜单的Blazor onchange事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！