每个value的值不同实现了，但是不知道怎么传给后台同样多的对象，我是这样实现的

Question

<table border="1" v-for="(item,i) in newList">

    <tr>

        <td colspan="3">{{item.deviceName}}</td>

    </tr>

    <tr v-for="(x,y) in item.list">

        <td>{{x.unitName}}</td>

        <td>{{x.itemName}}</td>

        <td v-show="x.itemType==2">

            <button class="btn" @click="zhengchang(item,i,x,y)">正常</button>

            <button class="btn" @click="yichang(item,i,x,y)">异常</button>

            <!--<button class="btn" @click="beizhu(x)">备注</button>-->

        </td>

        <td v-show="x.itemType==1">

            <input type="text" v-model="wen.two" @click="inputbeizhu(item,i,x,y)" />

        </td>

    </tr>

</table>

我是按着固定的下标加的，使用说不会重复，

zhengchang(item, i, x, y) {

    //            console.log(item);//每一个

    //            console.log(i);//每一个的下标

    //            console.log(x);//当前的item

    //            console.log(y);//当前的下标

    //            console.log(y);

    this.wen.three = 0;

    this.newList[i].list[y].value = this.wen.three;//当前的对象

    console.log(this.newList[i].list[y].value = this.wen.three);

    console.log(this.newList[i].list)

}

点击异常的时候

yichang(item, i, x, y) {

    //            let i=i;

    console.log(item);//每一个

    console.log(i);//每一个的下标

    console.log(x);//当前的item

    console.log(y);//当前的下标

    this.wen.three = 1;

    this.newList[i].list[y].value = this.wen.three;//当前的对象

    console.log(this.newList);

}

点击横线的时候

inputbeizhu(item, i, x, y) {

    let _this = this;

    //            alert(11)

    //            console.log(item);//每一个

    //            console.log(i);//每一个的下标

    //            console.log(x);//当前的item

    //            console.log(y);//当前的下标

    MessageBox.prompt('请输入值').then(({ value, action }) => {

        console.log(value)

        _this.wen.two = value;

        _this.newList[i].list[y].value = _this.wen.two;

        console.log(_this.newList[i].list[y].value);

    });

}

后台要的格式是这样的

arr:[

    {itemId:1,value:1},

    {itemId:1,value:"文字"},

    {itemId:1,value:2}

]    

填写完点击确定的时候我的json格式变为

w 我先怎么才能把格式写成后台需要的，而且生成和当前我的数组一样多的对象呢？

Answer 1

看样子是 Vue，在每一步操作的时候，实际都是修改了 newList 的内容，然后我猜你只需要把 newList 丢给后台就可以了。不过你似乎要先把 newList 中的 deviceId 和 deviceName 合并到 list 中的每一项里去……，可以通过 map 和 reduce 生成一个新的数组出来。给你个示例const data = [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; deviceId: 0,&nbsp; &nbsp; &nbsp; &nbsp; deviceName: "0000",&nbsp; &nbsp; &nbsp; &nbsp; list: [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; areaId: 1&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; areaId: 2&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; ]&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; deviceId: 1,&nbsp; &nbsp; &nbsp; &nbsp; deviceName: "0001",&nbsp; &nbsp; &nbsp; &nbsp; list: [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; areaId: 3&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; ]&nbsp; &nbsp; }];const all = data.reduce((all, group) => {&nbsp; &nbsp; const list = group.list&nbsp; &nbsp; &nbsp; &nbsp; .map(m => ({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ...m,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; deviceId: group.deviceId,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; deviceName: group.deviceName&nbsp; &nbsp; &nbsp; &nbsp; }));&nbsp; &nbsp; all.push(...list);&nbsp; &nbsp; return all;}, []);console.log(all);结果[ { areaId: 1, deviceId: 0, deviceName: '0000' },&nbsp; { areaId: 2, deviceId: 0, deviceName: '0000' },&nbsp; { areaId: 3, deviceId: 1, deviceName: '0001' } ]