c# - 在 blazor 中改变组件属性的正确方法

Question

我有两个组件，Child.razor和 Parent.razor .
Child.razor HTML:

<input type="text" value="@Text" />

Child.razor C#:

[Parameter] public string Text { get; set; }

和 Parent.razor HTML:

<Child @ref="child_1" />
<Child @ref="child_2" />
<Child @ref="child_3" />

Parent.razor C#:

Child child_1;
Child child_2;
Child child_3;

void SetText(Child item, string text)
{
    item.Text = text;
}

我在 item.Text = text 上收到警告:

Warning BL0005: Component parameter 'Text' should not be set outside of its component.

经过一番谷歌搜索，我发现了这个问题: BL0005 - external parameter usage - why is a warning for that?

答案很好，但没有提供替代方案(github上的链接内容也不是很有帮助)。

从父级改变组件参数的正确方法是什么？

编辑

再澄清一点:我知道我可以使用绑定(bind)，但我需要能够更改 SetText 中的值方法，将我想要变异的 Child 作为参数传递。绑定(bind)的问题是变量没有与组件绑定(bind)。换句话说:对于 Child 的引用，我不知道应该设置哪个绑定(bind)字符串。

例如:

<Child @ref="child_1" @Text="binding_1" />
<Child @ref="child_2" @Text="binding_2"/>
<Child @ref="child_3" @Text="binding_3"/>

Parent.razor C#:

Child child_1;
Child child_2;
Child child_3;

string binding_1;
string binding_2;
string binding_3;

void SetText(Child item, string text)
{
     // which binding string should I set?
}

我可以可视化一些时髦的代码，创建一个 Dictionary<Child, string>将 Component 与绑定(bind)字符串相关联，或者类似的东西，但是......真的吗？

Answer 1

您可以定义 类型的属性 child 在父组件中
将父组件 (this) 的引用传递给 Parent 类型的子组件属性。现在子组件持有对父组件的引用，它可以将自己(再次使用它)添加到父组件。现在您有了对子组件的引用，您可以将其 Text 属性设置为一些有趣的东西。我希望我很清楚，如果不是，我会发布代码来反射(reflect)这一点。以下代码有效...

child Razor

<input type="text" value="@Text" />

@code
{
    [Parameter] public string Text { get; set; }
    public void SetText(string text)
    {
        Text = text;
        StateHasChanged();
    }
    [ParameterAttribute] public Parent Parent { get; set; }
    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            Parent.AddToParent(this);
        }
    }
}

备注 原始组件参数 Text 在父组件 ( Text="Some Text" ) 中分配的值在文本框中不可见
因为在 Parent 的 SetText 方法调用 Child 的 SetText 方法之后立即将传递给它的值分配给 Text 属性，因此在文本框中看到的值是“新文本”

parent Razor

<Child Parent="this" Text="Some Text" />

@code{
    public void AddToParent(Child child)
    {
        string text = "new text";
        SetText(child, text);
    }

    void SetText(Child item, string text)
    {
        // which binding string should I set?
        item.SetText(text);

    }
}

用法

<Parent />