Blazor EditForm InputText答案

【问题标题】：Blazor EditForm InputTextBlazor EditForm InputText
【发布时间】：2022-01-12 18:12:10
【问题描述】：

您好，我是 blazor webassembly 的新手，我正在尝试建立一个具有一些基本功能的简单商店。

我正在尝试制作用于添加产品的表单，并且您知道每个产品都必须链接到一个用户，在我的情况下，我将用户的用户名存储在产品中，这是我现在能想到的最简单的方法.

但是我遇到了瓶颈，因为我不确定如何将用户的用户名包含到我的表单中，我获取用户名的方法是使用 <AuthorizeView> 上下文，然后从那里获取用户名。但是，我不知道如何将用户名放入<InputText>。

下面是我的 EditForm 的代码，用户名的 InputText 是第一个。

目前，用户需要输入自己的用户名来创建产品。

那么有什么方法可以自动将用户名分配给InputText 吗？

        <EditForm Model="@newproduct" OnValidSubmit="AddProduct">
            <DataAnnotationsValidator />
            <CustomFormValidator @ref="customFormValidator" />
            <div class="form-group row">
                <label class="control-label col-md-12">Username</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.username" />
                    <ValidationMessage For="@(() => newproduct.username)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Product Name</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.Name" />
                    <ValidationMessage For="@(() => newproduct.Name)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Product Description</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.Description" />
                    <ValidationMessage For="@(() => newproduct.Description)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Image</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.Image" />
                    <ValidationMessage For="@(() => newproduct.Image)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Stock</label>
                <div class="col">
                    <InputNumber class="form-control" @bind-Value=newproduct.Stock />
                    <ValidationMessage For="@(() => newproduct.Stock)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Price(no decimal)</label>
                <div class="col">
                    <InputNumber class="form-control" @bind-Value=newproduct.Price />
                    <ValidationMessage For="@(() => newproduct.Price)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Category</label>
                <div class="col">
                    <InputSelect class="form-control" @bind-Value="newproduct.P_Category">
                        <option value="">--Select--</option>
                        @foreach (var category in Categories)
                            {
                            <option value="@category.Name">@category.Name</option>
                            }
                    </InputSelect>
                    <ValidationMessage For="@(() => newproduct.P_Category)" />
                </div>
            </div>
            <div class="form-group" align="right">
                <button type="submit" class="btn btn-success">Add</button>
            </div>
        </EditForm>

测试

【问题讨论】：

@code{} 块中将newproduct.username 设置为您发现的用户名的代码行在哪里？绑定有两种方式：如果您从代码更改newproduct.username 的值，则更改将显示在 then 框中。如果您更改在框中看到的值，则下次读取属性时会在代码中显示

标签： c# blazor blazor-webassembly

【解决方案1】：

你可以试试这样的：

<AuthorizeView>
    <Authorized>
        @ { newproduct.username = @context.User.Identity.Name; }

        <EditForm Model="@newproduct" OnValidSubmit="AddProduct">
         ///////////
        </EditForm>
    </Authorized>
    <NotAuthorized>
        <a href="Identity/Account/Register">Register</a>
        <a href="Identity/Account/Login">Log in</a>
    </NotAuthorized>
</AuthorizeView>


@code
{
   private Product newproduct = new Product();

   
}

注意：在现实世界的场景中，客户应该与一个订单相关联（如果你愿意，你可以称它为购物车），而一个订单可能与订单的详细信息相关联，订单的详细信息是一个实体（OrderDetails），其中包含订单的详细信息。并且 OrderDetails 实体可能与给定的产品（产品实体）相关联

【讨论】：