Question

所以，我有一个简单的表格：

<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>

这是通过表格数据对象动态生成的：

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

我有一个用于v模型的预构建帐户对象：

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

但这不起作用。我没有收到任何错误，但是我的动态v模型没有获取account.firstname数据。我想解决什么问题？

Answer 1

不像这样在字符串中存储点符号要容易得多。首先，将数据组（即account和任何同级文件）包装在父对象中，例如mydata：

mydata: {
  account: {
    firstname: 'Initial firstname'
  }
  ... // Other model groups
}

在输入的数据组中添加一个属性：

group: 'account',
key: 'firstname'

并将模板更改为：

<input v-model="mydata[input.group][input.key]" />

请注意，您的v-model中也存在语法错误，因此不应存在任何前面的绑定:。

当我为v模型使用动态变量时，它不起作用

1 个答案: