vue.js中json数组格式问题

Question

RT,我现在需要在前端（vue）有多个input，然后生成一个json格式的form进行post。现在的问题在于，我无法把input内的输入变成数组格式进行存储。
例如我需要的json格式：

{
     “name”:"test",    
    "mylists":[
        {
            "user_ids":[100, 200],
            "group":"1"
        },
        {
            "user_ids":[400,500],
            "group":"2"
        }
    ]
}

但现在我只能得到如下格式：

{
    “name”:"test",    
    "mylists":[
        {
            "user_ids":”100, 200“,
            "group":"1"
        },
        {
            "user_ids":”400,500“,
            "group":"2"
        }
    ]
}

我的user_ids都是在同一input输入的。比如有两个input，第一个输入100，200 第二个输入400， 500 而非一个input只对应一个值。在这种情况下我如何能存储出我需要的那种json格式呢。输入后默认就是stirng，”100，200“。但我需要的是[100, 200]即int格式的数组。

Answer 1

在他还是对象的时候

form.mylists =  form.mylists.map(x => ({
    group: x.group,
    // 字符串 按照 , 分割且 去除  空字符串
    user_ids:  user_ids.split(',').filter(x => x.trim())
}))

就可以了

Answer 2

你可以用v-model绑定input变量自己构造一个数组不就行了

Answer 3

我个人觉得，你完全可以新增一个字段，用于表示你用来保存的数据，然后你再watchuser_ids用于对新增字段的同步。 没有必要使用user_ids既用于双向绑定，又用于数据保存，而且他们类型还是不一样。

...
data: {
     “name”:"test",    
    "mylists":[
        {    
            user_idsArr: [],
            "user_ids":[100, 200],
            "group":"1"
        },
        {
            "user_ids":[400,500],
            "group":"2"
        }
    ]
}
watch: {
  'mylists.user_ids' () {
     this.mylists.user_idsArr = this.mylists.user_ids.split(',')
  }
}
...