我有一个表格是通过v-for生成的.

注意:我用"@"来逃离刀锋.

我的vue Istance有:

data: {
    form: {
        inputs: [{icon: "",  name="",  placeholder: "", type="",  value=""}]
    },
    owner: {first_name: "", last_name: "", cell_phone: "", email: ""}
}

我使用以下命令生成表单:

<template v-for="input in form.inputs">
    <div style="margin-bottom: 25px" class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-@{{input.icon}}"></i></span>
         <input id="login-@{{input.name}}" v-model="?????" type="@{{input.type}}" class="form-control" name="@{{input.name}}" placeholder="@{{input.placeholder}}">
    </div>
</template>

我想将每个输入绑定到各自的承包商财产.所以我希望v-models的值是所有者.名字,主人.姓,主人.手机和主人.邮箱我希望我能做到:

 v-model="'owner' + @{{input.name}}"

但我得到:

[Vue warn]: v-model="'owner' + {{input.name}}": attribute interpolation is not allowed in Vue.js directives and special attributes.
vue.js:1956 Error: Warning Stack Trace
    at warn (vue.js:1956)
    at Directive.bind (vue.js:4507)
    at Directive._bind (vue.js:8668)
    at linkAndCapture (vue.js:7367)
    at compositeLinkFn (vue.js:7345)
    at new Fragment (vue.js:5373)
    at FragmentFactory.create (vue.js:5575)
    at Directive.create (vue.js:5844)
    at Directive.diff (vue.js:5757)
    at Directive.update (vue.js:5692)

所有者属性与输入相对应.每个输入的名称.

谢谢

应用程序描述:我正在try 使用多个表单建立一个所有者.每个表单都是通过ajax请求生成的,该请求获取一个表单对象,该对象包含表单的输入n和操作.

推荐答案

你可以试试这个:

v-model="owner[input.name]"

Vue.js相关问答推荐

Vue路由路径匹配行为

如何在Vue 3中将动态特性从主零部件同步到子零部件

Vuetify 3 - NavBar 组件占据整个视口高度

在 VueJS 中,将变量而不是组件的字符串名称传递给动态组件的 :is 属性不起作用

如何解决 importers[path] is not a function for clean Vue 3/Vite/Storybook installation

vue3 + pinia:如何从?store 中获取一个值

如何通过 setup() 发出多个参数?

在 vue.js 中添加新类时样式不适用

在 dom 内移动 Vue 组件?

VueJS + VueRouter:有条件地禁用路由

Proxy代理在 Vue 3 的控制台中是什么意思?

在加载数据之前触发mounted方法 - VueJS

如何让 Vue 在 shadow dom 中工作

Vue.JS 2.0 修改不相关数据时速度慢

在 Vue 应用程序中创建一个类的单个实例

带有 Google Auth Signin 的 Vuejs 全局函数

Vue组件如何命名

如何在我的 vue js 中实现无限滚动

将 Vue props与默认值合并

禁用外部主题文件产生的 Dart SASS 警告