javascript - 有没有办法将对象而不是数组发送到后端？ -ReactJS

Question

我有一张带有复选框的表格。单击后，我必须以如下方式收集数据:

"docList" : {
        "docID1" : "docNR1",
             "docID2" : "docNR2",
}

之后我必须向 BE 提出请求。 BE 将返回一个 ZIP 文件，其中包含所有单击或选择的文档。通常很简单，但我有一些问题。

我在构造函数中声明我的状态:

constructor(props) {
        super(props);
        this.state = {
         selected: []
}
};

然后我将函数传递到复选框中:

    handleCheckboxClick = (e) => {

        if(e.target.checked){
        this.setState({
            selected: [...this.state.selected, e.target.value],
        },()=>{
            console.log( this.state.selected)
        }); 
        } else {
            let remove = this.state.selected.indexOf(e.target.value);
            this.setState({
                selected: this.state.selected.filter((_, i) => i !== remove)
            },()=>{
                console.log( this.state.selected)
            }) 
        }

    }

<Checkbox value={rowData.documentId.toString() + rowData.documentNumber.toString()} onClick={this.handleCheckboxClick} />

从我的控制台我得到这个:

["1004212942019-DGD-2000000478"]

基本上，这是 docID + docNR 组合在一个字符串中。那么我怎样才能将它们分开并返回一个对象，每个对象都有两个分隔的字符串。

结果不是我所期望的，所以如果有人能帮助我，我会很高兴。谢谢

Answer 1

我将使用 JSON.stringify() 和 JSON.parse() 如下:

constructor(props) {
  super(props);
  this.state = {
    docList: {}
  };
};

<Checkbox value={JSON.stringify({documentId: rowData.documentId, documentNumber: rowData.documentNumber})} onClick={this.handleCheckboxClick} />

handleCheckboxClick = (e) => {
        let parsedVal = JSON.parse(e.target.value);
        let newDocList = {...this.state.docList};
        if(e.target.checked) {
          newDocList[parsedVal.documentId] = parsedVal.documentNumber;
        } else {
          delete newDocList[parsedVal.documentId];
        }
        this.setState({
            docList: newDocList
        }, ()=>{
            console.log(this.state.docList)
        }); 
    }