主页 / coding / 问题

问题[razor](coding)

Martin Hope
thecodeiackiller
Asked: 2024-10-18 06:09:30 +0800 CST
  • 5

我正在使用 Blazor Web 应用。我有一个枚举。它有三个值：UpperBody、LowerBody、FullBody。我的目标是让用户选择其中一个值。之后，程序将获取所选值（UpperBody、LowerBody、FullBody）并根据该值从数据库中筛选练习。这需要所选枚举值成功绑定到我的组件中的变量。我还没有找到这样做的方法。正如您将在我的代码中看到的，我还有一个方法，用于将所选枚举值打印到控制台。此外（正如您将看到的），我试图在 HTML 中打印枚举的值。这是为了调试，以便我可以“看到”我的更新值。

枚举：

namespace dataBindingProblem
{
    public enum WorkoutType
    {
        UpperBody, LowerBody, FullBody
    }
}

组件：

注意：此代码块缺少 EditForm 标签。因此，导航到 /selectworkout 端点时，您将遇到异常，指出需要使用 EditContext 或 Model。我不确定如何继续，因为我没有直接处理模型（尽管我确实尝试引入一个模型，如下所述）。

@page "/selectworkout"

<h3>Select Workout Type (From Enum Values) </h3>


    <label for="workoutselection"> Select Workout Type </label>
    <InputSelect id="workoutselection" @bind-Value="@selectedWorkoutType" @bind-Value:after="workoutTypeChanged">
        <option value=""> Select Workout Type </option>
        @foreach (var type in Enum.GetValues(typeof(WorkoutType)))
        {
            <option value="@type">@type</option>
        }
    </InputSelect>


<p>Selected Workout Type: @selectedWorkoutType</p>

@code {
    private WorkoutType selectedWorkoutType;

    public void workoutTypeChanged()
    {
        Console.WriteLine($"Workout Type Changed: {selectedWorkoutType}");
    }
}

我尝试过的事情

  • 我曾尝试重构我的组件以引入 UserExercise.cs 模型（如上所述），该模型具有属性 public WorkoutType WorkoutType {get; set;}。在此尝试中，我还将 EditContext 引入了 EditForm 标签。此尝试的灵感来自此。

  • 我尝试在 InputSelect 标签中使用 ValueChanged 参数。经过进一步检查，我将其替换为 bind-Value:after，灵感来自jeroba 的 2023 年解决方案。

  • 我曾尝试离开电脑，去 Qdoba 吃一碗墨西哥卷饼。

除了解决问题之外，如果以后有任何调试此类问题的建议，请告诉我。归根结底，我只想让 bind 工作。我考虑过重构应用程序并删除所有枚举，并为下拉列表引入一个内存列表，并最终过滤数据库，但我不认为枚举（及其相关模型）导致了问题。谢谢。

razor
Martin Hope
Gautzilla
Asked: 2023-11-16 22:40:45 +0800 CST
  • 5

我对 Blazor 非常陌生，并且正在遵循blazor-workshop教程。

我使用的是 .NET 版本 8.0.100

我使用计数器组件创建了示例项目，并进行了一些测试，我测试的所有内容都工作正常（例如通过 for 循环显示与计数器值相对应的多个表情符号，这种基本的东西）。

我进入了下一步，进行了建立待办事项列表的练习。

我一步步按照指南操作，具有完全相同的代码（步骤 4），但单击“添加待办事项”按钮不会执行任何操作。

我的Todo.razor组件：

@page "/todo"

<h3>Todo</h3>

<ul>
    @foreach(var todo in todos)
    {
        <li>@todo.Title</li>
    }
</ul>

<input placeholder="Something to do" @bind="newTodo" />
<button @onclick="AddTodo">Add</button>

@code {
    private List<TodoItem> todos = new();
    private string? newTodo;

    private void AddTodo()
    {
        if (!string.IsNullOrWhiteSpace(newTodo))
        {
            todos.Add(new TodoItem{Title = newTodo});
            newTodo = string.Empty;
        }
    }
}

我尝试在VS Code中调试它：我在“AddTodo()”方法的开头添加了一个断点，结果发现当我单击按钮时没有到达该方法。

我尝试将“Counter.razor”组件的内容（在创建新的 blazor 项目时创建）替换为“Todo.razor”组件的内容，这里一切正常：项目已添加到列表中当我点击按钮时。

有谁知道我在这里做错了什么？

谢谢！！

编辑：我错过了@rendermode InteractiveServer组件顶部的行。这样就解决问题了！但我没有看到用于标记 ℍ ℍ 的答案正确的绿色标记。

razor
Martin Hope
Damian K.
Asked: 2023-09-19 21:04:31 +0800 CST
  • 5

如何使@Text充当参数但在文本内？

例如，这里

<div class="alert alert-@AlertClassType">some@Text</div>

some@Text 被视为纯文本，
但是当string Text="thing"时，我期望结果中有“某物”。我很清楚，不是吗？

如果我愿意的话

<div class="alert alert-@AlertClassType">some @Text</div>

它会“工作”，但是 @ 之前的额外空格也会出现在渲染的内容中，
如何避免这种情况？

razor