Blazor条件传递RenderFragment到组件报无法识别子内容错误如何解决

报错原因 #

Blazor的Razor编译器解析组件子内容时，要求直接嵌套在组件标签内的RenderFragment参数标签不能被@if、@foreach等控制流语句包裹，否则控制流语句会被识别为未定义的普通子内容，就会触发Unrecognized child content inside component报错。

可行解决方案 #

该方案完全兼容第三方组件，无需修改组件源码，也不需要把控制逻辑写到模板内部：

方法：通过参数特性条件赋值RenderFragment #

你可以直接在组件的参数特性上做条件判断，满足条件时传入对应的模板片段，不满足时传入null，效果和条件传递参数完全一致：

<AwesomeComponent
    ItemTemplate=@<text>
        // some code here
    </text>
    AnotherItemTemplate=@<text>
        // blabla
    </text>
    YetAnotherItemTemplate="@(condition ? @<text>
        // wooho
    </text> : null)"
/>

如果模板内容较长，也可以提前将RenderFragment定义在代码块外，再传入参数：

<!-- 提前定义模板 -->
@{
    RenderFragment ItemTemplate = @<text>
        // some code here
    </text>;

    RenderFragment AnotherItemTemplate = @<text>
        // blabla
    </text>;

    RenderFragment YetAnotherItemTemplate = @<text>
        // wooho
    </text>;
}

<!-- 条件传参 -->
<AwesomeComponent
    ItemTemplate="@ItemTemplate"
    AnotherItemTemplate="@AnotherItemTemplate"
    YetAnotherItemTemplate="@(condition ? YetAnotherItemTemplate : null)"
/>

补充说明 #

这个场景不属于Blazor的功能限制，只是Razor语法的解析规则约束，上述方案的写法性能和原生传参完全一致，也符合Blazor的编码规范。

内容的提问来源于stack exchange，提问作者Diemauerdk