如果在 foreach 循环下动态生成 Textarea 多次以上，如何获取 Razor(blazor) 组件中的 Textarea 值

Question

如果在 foreach 循环下动态生成超过一次的 Textarea，任何人都可以帮助从 Razor 组件获取 Textarea 值。

我已经尝试过@bind-Value and value，但仍然无法单独获取所有 Textareas 值。

Razor component code
<EditForm Model="@userans" OnValidSubmit="@oninput">
    <DataAnnotationsValidator />
    <h3>Test </h3>


    @if (Questiontable == null)
    {

        <p><em>Loading...</em></p>
    }
    else
    {
        <table class="table">
            <thead>
                <tr>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in Questiontable[0].Questiondata)
                {
                    <tr>
                        <td>@item.Question</td>
                    </tr>
                    <tr>
                        <th>
                            **<textarea id="TextArea1" rows="2" cols="20" @bind="@userans.answers"></textarea>**
                        </th>
                    </tr>
                }
            </tbody>
        </table>
        <div align="center">
            <button class="btn btn-primary" type="submit" @onclick="btnnextclick">Next</button>
        </div>
    }
</EditForm>

Razor 组件正在加载来自数据库的数据并生成与数据库记录一样多的 Textarea，但是一旦更新 Textarea，我就需要获取不同 Textarea 中可用的所有值。

Answer 1

问题是你的每一个文本区域都绑定到同一个userans.answers

你可以做类似我刚刚测试过的事情：

 @page  "/test-loop"

<h3>TestLoop</h3>
@foreach (var test in TestList)
{
    <div>Id: @test.Id</div>
    <textarea @bind="test.TextAreaValue">

    </textarea>
}


@* To show it's working: *@/
@foreach (var test in TestList)
{
    <div>Id: @test.Id</div>
    @test.TextAreaValue
}
<br />

@* Get The values on an event test *@
<button @onclick="ButtonClicked">
    Test
</button>
@code {

    List<TestObject> TestList = new List<TestObject>();

    protected override void OnInitialized()
    {
        base.OnInitialized();
        TestList.Add(new TestObject()
        {
            Id = 1
        });
        TestList.Add(new TestObject()
        {
            Id = 2
        });
        TestList.Add(new TestObject()
        {
            Id = 3
        });
    }

    public void ButtonClicked()
    {
        //TestList has the values of each textarea in it
    }

    public class TestObject
    {
        public int Id { get; set; }
        public string TextAreaValue { get; set; }
    }
}