在按钮点击事件上调用blazor组件

Question

嗨，我有一个子组件位置网格，我想在父组件内点击按钮调用这个组件

下方的母体成分代码

<div class="form-group col-md-3">
<button class="btn btn-primary" @onclick="DisplayPositionRefGrid">
Create
</button>
</div>
</div>

<div class="form-row" id="divPositionRefGrid" hidden="@HideGrid">
<div class="form-group col-md-12">
<PositionRefGrid>
</PositionRefGrid>

</div>
</div>

问题是子组件在父组件加载的同时加载，但我想在按钮点击方法"DisplayPositionRefGrid"上加载子组件

Answer 1

使用布尔变量有条件地显示子组件。

<div class="form-group col-md-3">
<button class="btn btn-primary" @onclick="DisplayPositionRefGrid">
Create
</button>
</div>

@if (ShowGrid )
{
<div class="form-row" id="divPositionRefGrid" hidden="@HideGrid">
<div class="form-group col-md-12">
<PositionRefGrid>
</PositionRefGrid>

</div>
</div>
}
@code{
private bool ShowGrid {get;set;}
void DisplayPositionRefGrid()
{
ShowGrid =true;
//other stuf
//...
}
}

在线试用