vue js复选框，将json对象作为值传递给模型答案

【问题标题】：vue js checkbox, pass a json object as value to modelvue js复选框，将json对象作为值传递给模型
【发布时间】：2019-02-22 12:28:36
【问题描述】：

是否可以将 Json 对象作为值传递给复选框我有多个复选框，如下所示... selectedUsers 是一个包含所选值的数组... id 喜欢以 json 数组结尾，例如 [{"userid": "12345"}, {"userid": "54321"}]

<input
  :id="`checkbox` + index" v-model="selectedUsers"
  :value="{"userId": user.userId}"
  @change="selectUsers"

上面给了我一个解析错误解析错误：unexpected-character-in-attribute-name。

我可以传递这样的对象

  :value="{userId: user.userId}"

有什么聪明的方法可以在这里实现我想要的吗？

【问题讨论】：

所以你想将{"userId": user.userId} 作为字符串传递？
所以 user.id 是动态值....所以我想传递例如 {"userId": "123ABC"}... selectedUsers 是一个数组...我试图创建一个json数组
您的解析错误是因为您使用了相同类型的引号：:value="{"userId": user.userId}" 被解释为:value="{" 和userId": user.userId}"，其中第二个无效。改用不同的引号：`:value="{'userId': user.userId}"'
当然，这完全等同于根本不将userId 放在引号中，这是您在第二个中所做的......那么，您到底想要做什么？ :value="{userId: user.userId}" 究竟以何种方式没有做你想做的事？
所以我基本上是在尝试构建一个可以在 api 调用中使用的 json 数组......我在上面更新了我的问题......如果我使用 :value="{'userId': user.userId }"' 值仍然在数组中设置为 {userId: "1234"} ...

标签： javascript vue.js vuejs2 vue-component

【解决方案1】：

如果你愿意，你可以创建一个对象并将其传递给下面的值。

  <input
  :id="`checkbox` + index" v-model="selectedUsers"
  :value="details"
  @change="selectUsers">

  data: {
    details:{
    user:'userid'
    }
  }

【讨论】：

sorry probably wasnt explained well, so its a series of checkboxes... selectedUsers above is an array... and when a checkbox is selected i'd like to pass json object to it...
检查这个小提琴jsfiddle.net/RiddhiParekh/150amowf/7。在这个 v-model isChecked 中填充了正在传递的值。
是的，它适用于一个绑定，但不适用于多个
@blu10 我对 Rhiddhi 的评论做了一个小改动，jsfiddle.net/w6vz3e4q/1我相信这就是你想要的？
@jordan 我更新了你忘记改变量名了。jsfiddle.net/RiddhiParekh/vjm7ck5z

【解决方案2】：

调用一个方法并将用户ID传递给它：

<input
  :id="`checkbox` + index" v-model="selectedUsers"
  :value="userIdObj(user.userId)"
  @change="selectUsers">

然后在组件的方法声明中：

methods: {
    userIdObj(id) {
        return '{ "userId": ' + id + ' }';
    }
}

【讨论】：