Nested Checkboxes Vue

I can’t find a particularly good example online for how to implement this, so I’m hoping someone here can offer some guidance.

I have a data object in Vue that looks like this:

types: [
  id: 1,
  name: ‘Child’
  subcategories: [
    id: 1,
    name: ‘Personal’,
    fields: [
      id: 1,
      name: ‘Date of Birth’
    ]
  ]
]

I want to build out a nested list of checkboxes for the arrays within each, however only for the currently selected item. I.e.

[ ] Home
[x] Child
      [x] Personal
            [x] Name
            [ ] Address
            [x] Date of Birth
      [ ] School
      [x] Medical
            [x] Allergies

So the user checks the Child checkbox and a sublist of checkboxes show, selecting a category then shows the fields checkboxes for that category.

I need to save these selected options an array; the selected type, with any related selected subcategory and field so I can build a dynamic query with the selected options in Laravel.