When I use dynamic variables for my v-model it doesn't work

Question

So, I have a simple form:

<template v-for="form in forms">
    {{ form.header }}
    <template v-for="input in form.inputs">
        <label>{{ input.label }}</label>
        <v-flex class="xs12 md6">
            <input :v-model="input.key" />
        </v-flex>
    </template>

</template>

Which is being dynamically made from a forms data object:

forms:[
    {
        header: 'General Information',
        description: 'General Information',
        inputs: [
            {
                label: 'First name',
                key: 'account.firstname'
            },
        ]
    }

I have a pre-build account object for the v-model:

data: () => ({
    account: {
        firstname: 'Initial firstname'
    }
})

But this is not working. I get no errors, but my dynamic v-model is not getting the account.firstname data. What am I missing to fix this?

You'll need to use something like [Lodash's `_get`](https://lodash.com/docs/4.17.11#get) to translate that string path to an actual object reference — Phil, Jul 11 '19 at 01:29
Possible duplicate of [Convert JavaScript string in dot notation into an object reference](https://stackoverflow.com/questions/6393943/convert-javascript-string-in-dot-notation-into-an-object-reference) — Phil, Jul 11 '19 at 01:30
The desired output is just to display "Initial firstname" in the input. — DumbAnswersForDumbQuestions, Jul 11 '19 at 01:36
Are you only having issues with the `Initial firstname`? I think `{{ form.header }}` should also not display anything as your js file is using `forms`, not `form`. Do you have a working sample of this? I cannot run the codes that you have provided here. Also `v-for` should be used for reiterating items, like a `for loop`, were you able to make this code format work? If you want to change the content of your `input.key` dynamically, you might want to check this very straightforward tutorial from the vue.js documentation: https://scrimba.com/p/pXKqta/cQ3QVcr — tomjosef, Jul 11 '19 at 01:55

When I use dynamic variables for my v-model it doesn't work

0 Answers0