Accessing Nested Values

#1

What seems to be the problem:
In the docs (Properties), I read

Livewire supports binding to nested data inside arrays using dot notation:
<input type="text" wire:model="parent.message">

My component

class MilestoneEditor extends Component
{
    public $milestoneID;
    public $milestone;

    public function mount()
    {
        $this->milestoneID = request('id');
    } // end function

    public function render()
    {
        $this->milestone = TechMilestone::query()->find($this->milestoneID);

        return view('livewire.tech.milestone-editor');
    }
}

In the view, this works (so I know the value is there)

<div class="my-4 lg:flex">
        <div class="w-full lg:w-1/3">
            <label class="tw-label">Name</label>
            {{$milestone->name}}
        </div>
        ....
</div>

However when I follow the docs, this INPUT is empty

<div class="my-4 lg:flex">
        <div class="w-full lg:w-1/3">
            <label class="tw-label">Name</label>
            <input type="search" class="tw-input"
                   wire:model="milestone.name">
        </div>
       ....
</div>

WHAT am I doing wrong???

Steps to Reproduce:

Are you using the latest version of Livewire: YES

Do you have any screenshots or code examples: YES

#2

Note it says nested data inside arrays not models

Perhaps…

$this->milestone = TechMilestone::query()->find($this->milestoneID)->toArray();

and then change when you access data

{{$milestone['name']}}