javascript - 如何仅获取要在 react.js 中显示的特定变化数据
问题描述
我创建了购物车,产品名称、图片、价格和属性是在单独的组件中创建的。我遇到了一个问题,我只想获取特定产品变体的属性,但我得到了所有产品变体属性,如下图所示
上面显示了产品及其详细信息,但产品属性必须仅显示其特定的变体属性,但它会显示其所有变体属性。下面是产品的代码和MongoDB数据库结构。
我不知道我哪里错了,请帮助我。先感谢您。
解决方案
如果要获取属性的子集,可以使用数组过滤方法。例如:
const res = {
data: {
VariationList: {
Attribute: {
Weight: 1,
Length: 2,
Width: 3,
Hook: 4
}
}
}
};
function getProductAttributes(data, filterList = []) {
const entries = Object.entries(data.VariationList.Attribute);
if (!filterList.length) return entries;
return entries.filter((attr) => filterList.includes(attr[0]));
}
let output = getProductAttributes(res.data);
console.log(output); // [ [ 'Weight', 1 ], [ 'Length', 2 ], [ 'Width', 3 ], [ 'Hook', 4 ] ]
output = getProductAttributes(res.data, ['Weight', 'Length']);
console.log(output); // [ [ 'Weight', 1 ], [ 'Length', 2 ] ]
推荐阅读
- git - 如何自动清理合并压扁的分支?
- javascript - 单击三个按钮之一后如何显示 h2 元素,然后在主要部分显示后显示 h2 元素的一部分?
- php - 使用 Codeigniter 在登录用户的个人资料页面上显示信息?
- javascript - 从外部弹出窗口发送的 POST url 加载页面
- c++ - 如何正确返回链接 ilist 中的插入元素
- django - DoesNotExist at /accounts/login/ (delate example.com from admin page)
- javascript - 如何在 localStorage 中不断更新数据?
- javascript - 从远程托管页面访问 soket.io 服务器 - 需要未定义
- javascript - 使用 Bing Image API Javascript 搜索图像
- python - python替换数据框熊猫中所有列的多个值