如何使用给定键将字典值添加到“v-model”？答案

【问题标题】：How to add dictionary value to 'v-model' whith given key?如何使用给定键将字典值添加到“v-model”？
【发布时间】：2019-12-09 19:35:22
【问题描述】：

我正在尝试将 filterDataArray 添加到我的应用中，以便有条件地向我的 API 请求添加参数。

我已经创建了这样的 filterData 数组：

filterData: [
     {key: 'name', value: ''},
     {key: 'surname', value: ''},
     {key: 'age', value: ''}

现在我想绑定我的过滤器输入以获得这样的结果：

<v-text-field v-model="filterData.value.where(filterData.key == 'Name')"> 
</v-text-field>

然后将 filterData 传递给 APIController 并构建 get 请求，如下所示：

getfiltereddata(data) {
    var url = `/user?filtereddata=true`;
    data.forEach(element => {
    url = url + `&` + element.key + `=` + element.value;
}); //of course i have to check if valuie is not ''

最终产品应如下所示：

/user?filtereddata=true&name=nameinput&surname=surnameinput&age=ageinput;

非常感谢您的帮助。

【问题讨论】：

请详细说明您的用例
我编辑了我的问题。现在清楚了吗？
我想你想遍历 filterData 数组并将每个对象值绑定到一个输入？
是的。如果用户向文本字段添加内容，则字典中的特定条目会更改。例如，如果有人在名称文本字段中输入“John”，那么字典条目应该如下所示：{key: 'name', value: 'John'}
你检查我的答案了吗？

标签： javascript vue.js vuejs2 vue-component vuetify.js

【解决方案1】：

我认为您想要迭代 filterData 数组并将每个对象绑定到输入：

<template v-for="(data,index) in filterData">
    <v-text-field  v-model="filterData[index].value"> 
   </v-text-field>
</template>

【讨论】：