C# Blazor onchange事件和select下拉列表

因此，我一直在尝试在选择下拉列表值更改时触发一个简单的onchange。像这样：

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

无论我如何尝试重新定向，结果都是浏览器中出现了此错误

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

---

有什么明显的和关键的东西我遗漏了吗？因为我有一个按钮onclick事件，它在同一页面中工作得很好。

对于初学者，您没有使用正确的绑定语法：

onchange=“@dostuff”

---

请注意，@

您的答案应该在cshtml中：

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

@foreach（模板中的var模板）
{
@模板
}

然后您的@functions（在razor components@code中，请参见：）应该如下所示：

@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);
    }
}

@函数{
列表模板=新列表（）{“毛伊岛”、“夏威夷”、“尼豪”、“考艾岛”、“卡霍拉韦”}；
字符串selectedString=“Maui”；
无效DoStuff（变更事件参数e）
{
selectedString=e.Value.ToString（）；
Console.WriteLine（“它肯定是：+selectedString”）；
}
}

你也可以使用绑定

<select bind="@selectedString"> 

但是onchange=：@DoStuff允许您对选择执行逻辑

请注意，在预览6中，语法似乎将是@onchange=“@DoStuff”，并且将来可能是@onchange=“DoStuff”。

---

以下是一些更改的链接：

作为设置onchange事件的替代方法，您可以将下拉列表绑定到属性并处理属性集中的更改。通过这种方式，您可以在同一过程中选择所有值，而无需转换对象值。另外，如果您已经在select上使用了@bind，那么也不能在其上使用onchange

<select @bind="BoundID">
 ...
</select>

@code {
  private int? _boundID = null;
  private int? BoundID
  {
    get
    {
      return _boundID;
    }
    set
    {
      _boundID = value;
     //run your process here to handle dropdown changes
    }
  }
}

...
@代码{
private int？\u boundID=null；
私有int？BoundID
{
得到
{
返回_boundID；
}
设置
{
_boundID=值；
//在此处运行流程以处理下拉列表更改
}
}
}

以上答案对我不适用，出现编译错误

下面是我的工作代码

@inject HttpClient httpClient

@if (States != null)
{

<select id="SearchStateId" name="stateId" @onchange="DoStuff" class="form-control1">
    <option>@InitialText</option>
    @foreach (var state in States)
    {
        <option value="@state.Name">@state.Name</option>
    }
</select>
}


@code {
[Parameter] public string InitialText { get; set; } = "Select State";
private KeyValue[] States;
private string selectedString { get; set; }
protected override async Task OnInitializedAsync()
{
    States = await httpClient.GetJsonAsync<KeyValue[]>("/sample-data/State.json");
}

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

public class KeyValue
{
    public int Id { get; set; }

    public string Name { get; set; }
}
}

@inject-HttpClient-HttpClient
@如果（状态！=null）
{
@首字母文本
@foreach（状态中的var状态）
{
@州名
}
}
@代码{
[参数]公共字符串InitialText{get；set；}=“选择状态”；
私有密钥值[]状态；
私有字符串selectedString{get；set；}
受保护的重写异步任务OnInitializedAsync（）
{
States=wait httpClient.GetJsonAsync（“/sample data/State.json”）；
}
私有无效DoStuff（ChangeEventArgs e）
{
selectedString=e.Value.ToString（）；
Console.WriteLine（“它肯定是：+selectedString”）；
}
公共类键值
{
公共int Id{get；set；}
公共字符串名称{get；set；}
}
}

当然，我尝试了两种使用@的方法@dostuff（）和@dostuff。两者都给出了一个编译错误，说明您无法将类型void隐式转换为object。您的代码对我有用。也许你可以在某个地方分享你的整个项目？我道歉。我想分享代码，但目前它已经完全崩溃了，所以您无法调试和切换该下拉列表以查看异常。最新的blazor nuget软件包以某种方式破坏了路由，因此您得到的只是未破坏的（承诺）错误：System.InvalidOperationException:“Router”找不到任何具有“/”路由的组件。即使是在示例projectShare中，我也很乐意为您提供帮助，因为alsoyes始终使用“@”，您也可以使用@onchange=“dostuff”您正在使用的blazor的哪个版本，0.1.0或0.2.0我正在使用的0.2.1Blazor与第一个版本相比发生了巨大的变化。。。虽然我对此进行了测试，并且效果良好，但Blazor的快速变化可能最终会导致这个答案不再适用。如果发生这种情况，请告诉我，我会更新答案。即使语法正确，我无法为onchange事件触发此事件。当前要求您注意on前面的@change@Patrick此时，为了支持

@code

，NOTT

@functions

已被删除。实际上，onchange应该是@onchange。预览6中的此语法更改-它是3.0版本。正是我所需要的选择。非常有用，特别是如果你需要更改其他具有相同绑定的下拉列表！

@inject HttpClient httpClient

@if (States != null)
{

<select id="SearchStateId" name="stateId" @onchange="DoStuff" class="form-control1">
    <option>@InitialText</option>
    @foreach (var state in States)
    {
        <option value="@state.Name">@state.Name</option>
    }
</select>
}


@code {
[Parameter] public string InitialText { get; set; } = "Select State";
private KeyValue[] States;
private string selectedString { get; set; }
protected override async Task OnInitializedAsync()
{
    States = await httpClient.GetJsonAsync<KeyValue[]>("/sample-data/State.json");
}

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

public class KeyValue
{
    public int Id { get; set; }

    public string Name { get; set; }
}
}