Matblazor组件属性:复杂内容

Question

如果某个条件是假的，我正在尝试制作一个禁用的按钮。对于普通按钮，此操作如下：

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

我使用的是MatBlazor库，它具有MatButton版本的button

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

后者不起作用:它会产生以下错误：

组件属性不支持复杂内容(混合C#和标记)

在好的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要求您使用@( /*代码*/)，并期望它能够将其作为文本呈现到输出(在本例中为html)。Blazor需要文字、字段或属性。这样您就可以创建一个属性，如：

private bool isNotReady => !isReady;

这看起来似乎毫无意义，但实际上它的功能要强大得多--您可以执行许多逻辑，这些逻辑可以计算为真/假，或者任何需要向某个子组件显示的类型。因此，这也可以被认为是一种更好的分离关注。

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

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