我如何查看哪个代码正在设置我的组件参数 属性
How can i see which code is setting my components parameter property
我有一个关于 Blazor 组件的参数设置生命周期的一般性问题。
我在我的组件上进行了普通的双向绑定。
当我测试这个绑定时,最初似乎在更改参数值时没有任何反应。但在 debbung 期间,我注意到确实所有绑定步骤都已成功完成。绑定参数在父组件和子组件上都有正确的值。
现在奇怪的事情来了。
我没有运行调试到最后。我才往前走,看到子组件的属性又被设置成了原来的值。
所以我浏览了我的整个存储库以查找 setter 的触发器。现在我决定重写子组件上的 SetParameterAsync
方法。然后我看到一个框架,它将我的 属性 设置为旧值。
现在是我的问题。有谁知道找出哪个代码或组件设置 属性 的方法吗?
我有什么对象可以看到参数设置操作的发起者吗?
由于您没有提供任何细节,我将描述在调试组件中的棘手问题时我想要做什么。
- 重写所有组件事件并查看它们在页面呈现上的命中率。如果是几次,你需要明白为什么。
- 使用
Debug.Writeline
输出相关信息到输出window.
- 在断点处检查调用堆栈以查看谁在调用什么。
- 提供 class 个实例 Guid,这样您就可以跟踪您是否在处理同一个实例。您可以将它与
Debug.Writeline
结合使用以输出对象的每个实例化。
- 如果您是 运行 任何异步方法,请找出您认为正在发生的事情,然后使用上述方法在调试模式下测试您的模型。
对异步代码的误解经常会导致我认为您正在逃避的问题。
on changing the parameter value
您不应该更改参数值。参数 属性 是自动 属性。你不改变它的价值。只有父组件应该改变它的值。
您的子组件应如下所示:
ChildComponent.razor
<p><input type="text" @bind="BoundValue" @bind:event="oninput" /></p>
<p>
<button @onclick="ChangeValue">Change from Child</button>
</p>
@code {
[Parameter]
public string Property { get; set; }
[Parameter]
public EventCallback<string> PropertyChanged { get; set; }
private string BoundValue
{
get => Property;
set => PropertyChanged.InvokeAsync(value);
}
private Task ChangeValue()
{
return PropertyChanged.InvokeAsync($"New value set in Child {DateTime.Now}");
}
}
您的父组件可能如下所示:
@page "/"
<ChildComponent @bind-Property="MyProperty"/>
<p>MyProperty: @MyProperty</p>
@code
{
private string MyProperty { get; set; } = "Value sent to the child.";
}
请注意,子组件中名为 Property
的参数 属性 永远不会更改。这就是你应该如何编码。
正如你现在所理解的,只有父组件应该改变参数值,而不是子组件。这解释了为什么您的 属性 被分配了旧值。更具体地说,当您的父组件在几种情况下重新呈现时。以下内容来自文档:
A child component receives new parameter values that possibly overwrite existing values when the parent component rerenders. Accidentially overwriting parameter values in a child component often occurs when developing the component with one or more data-bound parameters and the developer writes directly to a parameter in the child:
The child component is rendered with one or more parameter values from the parent component.
The child writes directly to the value of a parameter.
The parent component rerenders and overwrites the value of the child's parameter.
More here
注意:在这方面,调试对您帮助不大...另请注意,Blazor 有特定的算法来确定应覆盖哪些类型以及在什么条件下。调试对你帮助不大。它只会让您感到困惑,并让您相信 Blazor 是有缺陷的软件。但是这里发生的事情是设计使然...
我有一个关于 Blazor 组件的参数设置生命周期的一般性问题。
我在我的组件上进行了普通的双向绑定。 当我测试这个绑定时,最初似乎在更改参数值时没有任何反应。但在 debbung 期间,我注意到确实所有绑定步骤都已成功完成。绑定参数在父组件和子组件上都有正确的值。
现在奇怪的事情来了。
我没有运行调试到最后。我才往前走,看到子组件的属性又被设置成了原来的值。
所以我浏览了我的整个存储库以查找 setter 的触发器。现在我决定重写子组件上的 SetParameterAsync
方法。然后我看到一个框架,它将我的 属性 设置为旧值。
现在是我的问题。有谁知道找出哪个代码或组件设置 属性 的方法吗? 我有什么对象可以看到参数设置操作的发起者吗?
由于您没有提供任何细节,我将描述在调试组件中的棘手问题时我想要做什么。
- 重写所有组件事件并查看它们在页面呈现上的命中率。如果是几次,你需要明白为什么。
- 使用
Debug.Writeline
输出相关信息到输出window. - 在断点处检查调用堆栈以查看谁在调用什么。
- 提供 class 个实例 Guid,这样您就可以跟踪您是否在处理同一个实例。您可以将它与
Debug.Writeline
结合使用以输出对象的每个实例化。 - 如果您是 运行 任何异步方法,请找出您认为正在发生的事情,然后使用上述方法在调试模式下测试您的模型。
对异步代码的误解经常会导致我认为您正在逃避的问题。
on changing the parameter value
您不应该更改参数值。参数 属性 是自动 属性。你不改变它的价值。只有父组件应该改变它的值。
您的子组件应如下所示:
ChildComponent.razor
<p><input type="text" @bind="BoundValue" @bind:event="oninput" /></p>
<p>
<button @onclick="ChangeValue">Change from Child</button>
</p>
@code {
[Parameter]
public string Property { get; set; }
[Parameter]
public EventCallback<string> PropertyChanged { get; set; }
private string BoundValue
{
get => Property;
set => PropertyChanged.InvokeAsync(value);
}
private Task ChangeValue()
{
return PropertyChanged.InvokeAsync($"New value set in Child {DateTime.Now}");
}
}
您的父组件可能如下所示:
@page "/"
<ChildComponent @bind-Property="MyProperty"/>
<p>MyProperty: @MyProperty</p>
@code
{
private string MyProperty { get; set; } = "Value sent to the child.";
}
请注意,子组件中名为 Property
的参数 属性 永远不会更改。这就是你应该如何编码。
正如你现在所理解的,只有父组件应该改变参数值,而不是子组件。这解释了为什么您的 属性 被分配了旧值。更具体地说,当您的父组件在几种情况下重新呈现时。以下内容来自文档:
A child component receives new parameter values that possibly overwrite existing values when the parent component rerenders. Accidentially overwriting parameter values in a child component often occurs when developing the component with one or more data-bound parameters and the developer writes directly to a parameter in the child:
The child component is rendered with one or more parameter values from the parent component. The child writes directly to the value of a parameter. The parent component rerenders and overwrites the value of the child's parameter. More here
注意:在这方面,调试对您帮助不大...另请注意,Blazor 有特定的算法来确定应覆盖哪些类型以及在什么条件下。调试对你帮助不大。它只会让您感到困惑,并让您相信 Blazor 是有缺陷的软件。但是这里发生的事情是设计使然...