Changing property in Razor @ref component does not update its usage in HTML element

Beginner at Blazor here.

I have this very simple Razor component that has a property named Paragraph which is being used by the HTML <p> element:

<p>@Paragraph</p>@code {    public string Paragraph { get; set; } = "initial value";}

In a parent component, I use this component (named Foo) and change the Paragraph property in OnAfterRender:

<Foo @ref="_foo" />@code {    private Foo? _foo;    protected override void OnAfterRender(bool firstRender)    {        if (firstRender)        {            if (_foo is not null)            {                _foo.Paragraph = "Changed";            }        }    }}

However, this doesn't really do anything; I still see the paragraph 'initial value' and not 'Changed'. In fact, the line of code _foo.Paragraph = "Changed"; does execute, but I don't really see anything being changed.

I also tried to invoke the StateHasChanged() method on the parent element after changing the Paragraph property but it didn't really change anything.

Is there a technical reason on why the paragraph doesn't change to Changed? I've seen numerous similar questions but haven't found a solution that solves my problem.