Blazor Wasm sees the inner object as null and I am not sure why. (Using VS 2022/.net core 6)

Question

I have built a really simple example:

tester.razor:

@page "/test"
@using VetJobSearch.UI.ViewModels
<EditForm Model=@outerClass>    
    <OuterComponent OuterClass="@outerClass"/>
</EditForm>

OuterComponent.razor:

@using ViewModels
<InnerComponent InnerClass=OuterClass.InnerClass/>
@code {
    [Parameter] public OuterClass OuterClass { get; set; } = new OuterClass() 
    { InnerClass = new InnerClass() };
}

InnerComponent.razor:

@using ViewModels
<div>Inner Component</div>      
<InputText @bind-Value=InnerClass.InnerText />
@code {
   [Parameter] public InnerClass InnerClass { get; set; } = new InnerClass();
}               

And here are the classes themselves:

public class OuterClass
{
    public string? OuterText {  get; set; }
    public InnerClass? InnerClass { get; set; }
}

public class InnerClass
{ 
    public string? InnerText{  get; set; }
}

I must be missing something because every time i run it, I get:

Unhandled exception rendering component: Object reference not set to an instance of an object.

System.NullReferenceException: Object reference not set to an instance of an object.

Any help would be greatly appreciated!

Answer 1

try to remove all ? since string and ref types are null by default and add init

public class OuterClass
{
    public string OuterText {  get; set; }
    public InnerClass InnerClass { get; set; } = new InnerClass();
}

public class InnerClass
{ 
    public string InnerText{  get; set; }
}