将数据加载到购物车的最佳方式是什么?

Question

我有一个带有附加项和选项的产品，这些附加项和选项保存在不同的数组中，像这样，

const Prods = [{
ID: 0,
Nome: 'Açai no Copo 290ml',
Descricao: 'Acai com chocoball e confete ',
Categoria: 0,
Preco: 10.00,
AdicionaisGroup: 0, // the ID of additional group 
OpcoesGroup: 0, // ID of options group
},
const Opcoes = [{ // Options Group
ID: 0, // ID of options group
Nome: 'Opções açai',
MaxOpcoes: 2,
Itens: [{  //Items of options group
Nome: 'Chocoball',
ID: 0,
},
const Adicionais = [{ // additional group
ID: 0, // ID of additiones group
Nome: 'Adiocinais Açai',
MaxOpcoes: 3,
Itens: [{
Nome: 'Morango',
Valor: 5.00,
ID: 0,
},

我的问题是，当用户将产品添加到购物车时，产品数据保存在这个结构

中

{
"ID": 5, // the product ID
"idAdicionais": [ // here i have the items id's of the additional group
1,
2
],
"idOpcoes": [  // Here i have the items id's of the options group
0,
1
],
"Qtd": 1,
"obs": "",
"idAdicionaisGroup": 0,  //Here i have the ID of additional group
"idOpcoesGroup": 0 // here i have the ID of options group
}

我不知道如何创建一个具有此产品所有数据和所有附加选项的对象，我试图创建一个函数，如getproductoscart但是这个函数返回三个这样的数组

{
"Produtoresult": [
[
{
"ID": 0,
"Nome": "Açai no Copo 290ml",
"Descricao": "Acai com chocoball e confete ",
"Categoria": 0,
"Preco": 10,
"AdicionaisGroup": 0,
"OpcoesGroup": 0
}
]
],
"ProdutoOpcoes": [ // this is the options what the user have selected
[
[
{
"Nome": "Chocoball",
"ID": 0
},
{
"Nome": "Confete",
"ID": 1
}
]
]
],
"ProdutoAdicionais": [ // this is the additional what the user have selected
[
[
{
"Nome": "Raspas de Chocolate",
"Valor": 5,
"ID": 1
},
{
"Nome": "Biz de Chocolate",
"Valor": 5,
"ID": 2
}
]
]
]
}

这个函数返回我需要的数据，但是，我不知道如何创建这样的单个对象

ProdsCart = [{
"ID": 0,
"Nome": "Açai no Copo 290ml",
"Descricao": "Acai com chocoball e confete ",
"Categoria": 0,
"Preco": 10,
"Qtd": 2,
"AdicionaisGroup": 0,
"OpcoesGroup": 0,
"ProdutoOpcoes": [{
"Nome": "Chocoball",
"ID": 0
}, {
"Nome": "Confete",
"ID": 1
}],
"ProdutoAdicionais": [{
"Nome": "Raspas de Chocolate",
"Valor": 5,
"ID": 1
},
{
"Nome": "Biz de Chocolate",
"Valor": 5,
"ID": 2
}]
}],

功能

const getProdutos = () =>{
const Produtoresult = ProdutosCart.map((item) => (getProduto(item.ID))) // get the product data
const ProdutoOpcoes = ProdutosCart.map((item) => (getProdutoOpcoesChecked({groupID:item.idOpcoesGroup, idx: item.idOpcoes}))) // get the options data
const ProdutoAdicionais = ProdutosCart.map((item) => (getProdutoAdicionaisChecked({groupID: item.idAdicionaisGroup, idx: item.idAdicionais}))) // get the additiones data
const data ={
Produtoresult,
ProdutoOpcoes,
ProdutoAdicionais
}
console.log(data)
}

另一个问题，产品，附加组和选项组的数据是加载产品上下文，最好的做法是这样做，还是更好的直接加载数据库?

Answer 1

进行以下更改会产生期望的结果:

使用<<ol>

strong>找到而不是过滤器在getProduto ()。

更正getproductoadicionaischecked ()中的错字。将ItensA替换为items。

修改getproductos ()

如下所示。此代码遍历购物车中的产品，并为每个产品获取产品详细信息，productoopcoeschecked和productoadicionaischecked在单个对象中返回所有这些数据。因此该方法返回一个对象数组，其中对象包含购物车中每个产品的合并数据。

const getProdutos = () =>{
const Produtoresult = ProdutosCart.map((item) => 
{
return {
// get the product data
...getProduto(item.ID), 
// get the options data
ProdutoOpcoes: getProdutoOpcoesChecked({groupID:item.idOpcoesGroup, 
idx: item.idOpcoes}),  
// get the additiones data
ProdutoAdicionais: getProdutoAdicionaisChecked({groupID: item.idAdicionaisGroup, idx: item.idAdicionais})
}
}
); 
return Produtoresult;
}