Blazor server side how to use a llist of RenderFragment

Question

I am trying to use somthing similar to this example to create a dynamic table where I can define columns myself.

Symptom is that only the header is printed, rows are empty.

My observation is that Columns is empty when iterating through the data rows. Second test showed that the DataTable.AddColumn call occurs after the rows are printed which explains why rows are indeed empty (as columns are empty there's nothing to be printed!)

For sure there's some logic missing to make sure the Columns are indeed added prior to printing rows - but I couldn't spot it.

Answer 1

The magic trick is to add the OnAfterRender (or async version of it) to notify changes on first render...

protected override void OnAfterRender(bool firstRender) {
    if (firstRender) {
      // The first render will instantiate the GridColumn defined in the ChildContent.
      // GridColumn calls AddColumn during its initialization. This means that until
      // the first render is completed, the columns collection is empty.
      // Calling StateHasChanged() will re-render the component, so the second time it will know the columns
      StateHasChanged();
    }
  }

Credits to this post.