vue.js如何删除未输入值得部分

Question

如何能做到只发送输入的内容到后端。现阶段写了3个输入框，实际使用的时候可能只会输入其中的2个值，但是现在因为都是写死的，每次都会发送3个框的内容，哪怕是空。不知道如何做到选择性发送,即只得到有输入值的json。
我的data部分：

testData:{
    “name”:"test",    
    "mylists":[
        {
            "user_ids":'',
            "group":''
        },
        {
            "user_ids":'',
            "group":''
        },
         {
            "user_ids":'',
            "group":''
        }
      
    ]
    
}

submit代码：

submit(event){
        event.preventDefault();
       
        let formData = new FormData();
        let testData = JSON.stringify(this.testData);
        formData.append('testData', testData);
  
        axios.post("/", formData
          ,config
          ....

比如只输入前两个，却得到的：

{
    “name”:"test",    
    "mylists":[
        {
            "user_ids":'1',
            "group":'1'
        },
        {
            "user_ids":'1',
            "group":'1'
        },
         {
            "user_ids":'',
            "group":''
        }
      
    ]
    
}

在这种情况下，如何能让第三行没有值的不显示出来？

Answer 1

最优的 写法 是 写个 过滤器，我们 公司是写了一个 diff 算法来 判断什么修改了，只上传修改的 或者 新增的
你这个 需求 还是在于 上传

mylists = mylists.filter(x => !x.ser_ids.tirm() && !x.group.tirm()) 过滤掉没有的

但是你 只要 第三个

if (!mylist[2]。user_ids.tirm() && !mylist[2].group.tirm()) {
   mylist = mylist.slice(0,2)
}

其实最好 不要改变 原有的 数据 最好的情况是 用 深拷贝 一份新数据 对其进行操作
因为 后端如果 错误，你原有数据改变 的情况下 是 无法 再一次 进行相同的 操作de

Answer 2

用computed计算属性

Answer 3

这样子试试

testData
.replace(',{"user_ids":"","group":""}','')
.replace('{"user_ids":"","group":""},','')

最好还是这样

let testData = {}    
for(let i =0 ; i<this.testData.length ; i++){
    let t = this.testData[i]
    if(!t["user_ids"]&&!t["group"]){
        testData.push(t)
    }
}
let json = JSON.stringify(testData)