Matblazor 组件属性：复杂内容

Question

我正在尝试制作一个按钮，如果某个条件为假，该按钮将被禁用。对于常规按钮，这有效：

<button @disabled="!IsReady">Click me</button>
@code
{
    public bool IsReady { get; set; }
}

我正在使用具有 MatButton 版本 button 的 MatBlazor 库：

<MatButton Disabled="@!IsReady">Click me</MatButton>

后者不起作用：它给出以下错误：

Component attributes do not support complex content (mixed C# and markup)

在好的 ol'WPF 中，我们可能会在绑定中使用转换器，因此绑定的布尔值会被反转。这是 MatBlazor 的限制吗？

我看到的快速解决方案是执行以下操作：

<MatButton Disabled="@IsNotReady">Click me</MatButton>
@code
{
    public bool IsReady { get; set; }
    public bool IsNotReady => !IsReady;
}

有没有更好的方法？

Answer 1

最终解决方案非常简单：您只需要用括号将 C# 代码括起来：

<MatButton Disabled="@(!IsReady)">Click me</MatButton>

Answer 2

使用 @ 符号时，通常是从 HTML 上下文切换到 C# 上下文。因此，当您说类似 Disabled="@IsNotReady" 的内容时 - 它工作得很好。当你尝试做一些更复杂的事情时，即使只是一个“！”运算符，这足以成为需要评估的东西，而不仅仅是对值的引用。因此，Blazor 要求您使用 @( /* code*/ ) 并期望它计算出可以呈现为输出文本的内容（在本例中为 html）。 Blazor 需要文字、字段或属性。所以你可以创建一个属性例如：

private bool isNotReady => !isReady;

这可能看起来毫无意义，但实际上它的功能要强大得多 - 您可以执行许多计算结果为 true/false 的逻辑或您需要呈现给某些子组件的任何类型。所以这也可以说是更好的关注点分离。

因此您的代码可以更像这样阅读：

<MatButton Disabled="@IsNotReady">Click me</MatButton>

Matblazor 组件属性：复杂内容

Matblazor component attributes: complex content

binding

blazor

matblazor