使用useState有条件地更新状态的一部分

Question

如果新信息对象的名称与状态中的名称相同，我将尝试更新我的状态以包含新信息对象。例如

当新信息：

{
serviceName:
name: A
properties:{
cost: 300
service:"Good"
}
}

匹配现有状态的名称：

{
serviceName:
name: A
properties:{
cost: 600
service:"Bad"
}
}

目标是我可以合并属性，结果是：

{
serviceName:
name: A
properties:{
cost: [300,600]
service:["Good", "Bad"]
}
}

我得到的最接近的结果是第一次匹配，但随后的匹配会产生一个数组，就像这样(匹配了三个项目，所以应该有一个数组包含3个项目的成本和服务(：

{
"name": "State",
"value": [
{
"serviceName": {
"name": "Informational Website - subscription",
"properties": {
"service": [
[
"Mobile-ready, Responsive Design",
"Blog Articles"
],
"Collect visitor information (email / phone)"
],
"cost": [
[
"300",
"500"
],
"500"
]
}
}
}
],
"subHooks": []
},

我用以下代码实现了上述目标：

const [informationalService, setInformationalService] = useState([]);
const handleChecking = (e, item) => {
const { name } = e.target;
if (informationalService.length > 0) {
const selectedName = informationalService.filter(
selection => selection.serviceName.name === name
);
const selectedNamePropertiesCost = selectedName.map(
prop => prop.serviceName.properties.cost
);
const selectedNamePropertiesService = selectedName.map(
prop => prop.serviceName.properties.service
);
const notSelectedName = informationalService.filter(
selection => selection.serviceName.name !== name
);
const serviceChecked = selectedName.filter(
selected => selected.serviceName.properties.service !== item.service
);
setInformationalService([
...notSelectedName,
{
serviceName: {
name,
properties: {
service: [...selectedNamePropertiesService, item.service],
cost: [...selectedNamePropertiesCost, item.cost]
}
}
}
]);
} else {
setInformationalService([
{
serviceName: {
name,
properties: {
service: item.service,
cost: item.cost
}
}
}
]);
}
};

Answer 1

我将忽略目标后的部分，并执行以下操作：

let data = {
serviceName: {
name: "A",
properties:{
cost: 300,
service:"Good"
}
}
let olddata = {
serviceName: {
name: "A",
properties:{
cost: 600,
service:"Bad"
}
};
let newprops = {},
dataprops = data.serviceName.properties,
olddataprops = olddata.serviceName.properties;
for (let prop in dataprops) {
if (olddataprops[prop]) {
newprops[prop] = [dataprops[prop], olddataprops[prop]];
} else {
newprops[prop] = dataprops[prop];
}
}