无法制作嵌套组件

Question

对不起，如果问题与我的经验不足有关。我正在尝试制作一个组件库，以使用blazor的mapbox。现在，我有一个主要组件MapBoxView，它显示一个地图和MapboxGeocoder，用于查找对象。每个组件的主要组件OnFirstAfterRenderAsync（）中都有一个过程：

protected async override Task OnFirstAfterRenderAsync()
{
    await base.OnFirstAfterRenderAsync();
    Dictionary<string, object> o = new Dictionary<string, object>();
    ...
    await JsInvokeAsync<object>("mapgl.mymap.initMap", o);
}

以及嵌套组件中的

protected async override Task OnFirstAfterRenderAsync()
{
    await base.OnFirstAfterRenderAsync();
    Dictionary<string, object> o = new Dictionary<string, object>();
    o.Add("container", container);
    await JsInvokeAsync<object>("mapgl.mygeocoder.initGeocoder", o);
}

在演示程序中，我使用代码：

@page "/"

<MapBoxView zoom=@_zoom container=@containerName mapCenter=@centerOfView>
</MapBoxView>

<MapBoxGeocoder Id="geocoder">
</MapBoxGeocoder>

然后一切正常，我得到了我想要的照片：

在演示程序中，我使用代码：

<MapBoxView zoom=@_zoom container=@containerName mapCenter=@centerOfView>
    <MapBoxGeocoder Id="geocoder">
    </MapBoxGeocoder>
</MapBoxView>

也就是说，我将嵌套组件放在主组件中，然后未显示地址解析器（带有文本的左下窗口-在图片上搜索），并且程序未进入MapBoxGeocoder组件的过程OnFirstAfterRenderAsync（）。 主要组件MapBoxView具有剃须刀代码：

@namespace MapBoxBlazor

@inherits BaseMapBoxView

    <div id='mapContainer'>
    </div>

我在做什么错？怎么做对呢？

Answer 1

您应该看一下有关ChildContent的文档。

您需要使用名为RenderFragment的{​​{1}}来渲染嵌套组件。

父组件必须具有属性

ChildContent

并将其渲染到您想要的位置。例如

public RenderFragment ChildContent { get; set; }

此属性将呈现父组件中的所有内容。

因此，对于您而言，<div> @ChildContent </div> 应该拥有MapBoxView并将其渲染到内部才能正常工作。