Trying to get property from Controller to Blade to Vue

I have created a new page (not dissimilar to the default settings page) where I have listed details of a users's household. I am trying to get the properties of 'person', 'user', and 'household' into the Vue component but receive the error, Property or method "household" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. among similar errors referencing missing 'person' as well.

This is what my household-details.blade.php contains:

<household-details :user="user" :household="household" :person="person" inline-template>
...
<form role="form">
...
                        <input type="text" class="form-control" name="name" v-model="form.name" :class="{'is-invalid': form.errors.has('name')}">
</form>
...
</household-details>

This is what is inside my household-details.js contains:

var base = module.exports = {
    props: ['user', 'person', 'household'],

    /**
     * The component's data.
     */
    data() {
        return {
            form: new SparkForm({
                name: '',
                legal_name: '',
            })
        };
    },


    /**
     * Bootstrap the component.
     */
    mounted() {
        this.form.name = this.household.name;
        this.form.legal_name = this.household.legal_name;
    },


    methods: {
        /**
         * Update the user's contact information.
         */
        update() {
            Spark.put('/settings/household', this.form)
                .then(() => {
                    Bus.$emit('updateHousehold');
                });
        }
    }
};

Vue.component('household-details', {
    mixins: [base]
});

And finally, my controller has this:

class SettingsHouseholdController extends Controller {
    public function __construct() {
        $this->middleware('auth');
    }
    public function index(Request $request) {
        $user = Auth::user();
        $person = $user->getPerson($user->currentTeam->id);
        $household = $person->household();
        return view('settings.household.household', ['household' => $household, 'person' => $person, 'user' => $user]);
    }
}

I can't figure out what I'm missing.

Am I going about this all wrong? I'm trying to copy how spark does its 'update-contact-information' page, but this is all I find in the js:

var base = require('settings/profile/update-contact-information');

Vue.component('spark-update-contact-information', {
    mixins: [base]
});

I can't figure out where that base require is even coming from.

Any help appreciated.