blazor 自定义组件时同时使用变量的绑定和变量变化绑定

原创

已于 2025-01-27 10:46:14 修改 · 204 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #服务器 #blazor 自定义组件 #Blazor

于 2025-01-07 18:16:41 首次发布

在使用blazor 自定义组件时有时需要同时使用变量的绑定和变量变化绑定

@page "/parent"

<h3>Parent Component</h3>

<p>Current Value: @currentValue</p>

<ChildComponent @bind-Value="currentValue" OnValueChanged="HandleValueChanged" />

@code {
    private string currentValue = "Initial Value";

    private void HandleValueChanged(string newValue)
    {
        currentValue = newValue;
        // 在这里可以执行其他操作
        Console.WriteLine($"Value changed to: {newValue}");
    }
}

<h3>Child Component</h3>

<input @bind="Value" @bind:event="oninput" />

<button @onclick="TriggerCallback">Change Value</button>

@code {
    [Parameter]
    public string Value { get; set; }

    [Parameter]
    public EventCallback<string> ValueChanged { get; set; }

    [Parameter]
    public EventCallback<string> OnValueChanged { get; set; }

    private async Task TriggerCallback()