每个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 = [
    {
        deviceId: 0,
        deviceName: "0000",
        list: [
            {
                areaId: 1
            },
            {
                areaId: 2
            }
        ]
    },
    {
        deviceId: 1,
        deviceName: "0001",
        list: [
            {
                areaId: 3
            }
        ]
    }
];

const all = data.reduce((all, group) => {
    const list = group.list
        .map(m => ({
            ...m,
            deviceId: group.deviceId,
            deviceName: group.deviceName
        }));
    all.push(...list);
    return all;
}, []);

console.log(all);

结果

[ { areaId: 1, deviceId: 0, deviceName: '0000' },
  { areaId: 2, deviceId: 0, deviceName: '0000' },
  { areaId: 3, deviceId: 1, deviceName: '0001' } ]