ARenderFragment期望只返回一个组件,但该组件可能具有嵌套组件:
private RenderFragment CreateRenderFragment()
{
// This works
return
@<div>
<text>Hello</text>
<text>world!</text>
</div>;
// and so does this
// return @<span><text>Hello</text> <text>world!</text></span>;
}
Run Code Online (Sandbox Code Playgroud)
如果我们不想将组件包含在 a 中<div>,或者<span>我们可以按照约定创建一个 razor 组件ChildContent,例如ChildContentComponent:
@ChildContent
@code
{
[Parameter] public RenderFragment ChildContent { get; set; }
}
Run Code Online (Sandbox Code Playgroud)
然后使用该组件作为包装器:
private RenderFragment CreateRenderFragment()
{
return
@<ChildContentComponent>
<text>Hello</text>
<text>world!</text>
</ChildContentComponent>;
}
Run Code Online (Sandbox Code Playgroud)
我可能错过了一些东西,但我看不到任何其他方法来创建RenderFragment具有多个组件的组件。以下均不能编译:
private RenderFragment CreateRenderFragment1()
{
return @<text>Hello</text> <text>world!</text>;
}
private RenderFragment CreateRenderFragment2()
{
return
@:@{
<text>Hello</text>
<text>world!</text>
} // ; expected, but will not compile with, either
}
Run Code Online (Sandbox Code Playgroud)
是否有比该ChildContentComponent方法更简单的方法,或者是否已经有一个简单声明 a 的标准组件public RenderFragment ChildContent { get; set; }?
编辑:
根据下面 MrC aka Shaun Curtis 的回答,解决方案是__builder => { ... };
private RenderFragment CreateRenderFragment3()
{
return __builder =>
{
<Widget1>Hello</Widget1>
<Widget2>world!</Widget2>
};
}
Run Code Online (Sandbox Code Playgroud)
编辑 2:
正如下面 Dimitris Maragkos 和 HH pont 所指出的,<text>是一个特殊的无所事事的包装器,它是等效的:
private RenderFragment CreateRenderFragment3()
{
<text>
<Widget1>Hello</Widget1>
<Widget2>world!</Widget2>
</text>
}
Run Code Online (Sandbox Code Playgroud)
bUnit 有一个称为Secret Sauce的技巧
private RenderFragment CreateRenderFragment =>
@<text>
<div>Hello</div>
<Widget>world!</Widget>
</text>;
Run Code Online (Sandbox Code Playgroud)
仅渲染the<div>和 the ,而不渲染 he 。<Widget><text>
<text>这显然是RenderFragment 中外部的特殊规则。