javascript - 在reactjs中映射项目并展平为单个数组
问题描述
目前我有一个 reactjs 函数,它简单地查询一个 pouchDB 文档,获取 7 条记录,然后我试图展平这些记录以便存储在状态中。问题是,现在当我 console.logdocCalories
我得到这个:
(7) [{…}, {…}, {…}, {…}, {…}, {…}, {…}]
0: {caloriesBurned: "5345", createdAt: "2020-03-28T05:15:24.369Z"}
1: {caloriesBurned: "1234", createdAt: "2020-03-28T10:39:16.901Z"}
2: {caloriesBurned: "1122", createdAt: "2020-03-28T10:32:03.100Z"}
3: {caloriesBurned: "1234", createdAt: "2020-03-28T05:16:54.846Z"}
4: {caloriesBurned: "1234", createdAt: "2020-03-28T10:21:31.092Z"}
5: {caloriesBurned: "1234", createdAt: "2020-03-28T05:08:00.791Z"}
6: {caloriesBurned: "1234", createdAt: "2020-03-28T05:07:35.940Z"}
length: 7__proto__: Array(0)
但我想得到这样的东西:
map: [5345,1234,1122,1234,1234,1234,1234]
所以基本上一个对象包含每个文档的卡路里燃烧值中的 7 个数字
我在这里做错了什么,如何正确地将它们放入一个数组/对象中?
setMax = () => {
this.state.caloriesDB.db.find({
selector: {
$and: [
{_id: {"$gte": null}},
{caloriesBurned: {$exists: true}},
{createdAt: {$exists: true}}
]
},
fields: ['caloriesBurned', 'createdAt'],
sort: [{'_id':'desc'}],
limit: 7
}).then(result => {
const newDocs = result.docs;
const docCalories = newDocs.map((caloriesBurned) => caloriesBurned)
console.log('this is map');
console.log(docCalories);
}).catch((err) =>{
console.log(err);
});
}
解决方案
您在 map 函数中返回整个对象,而您应该只发送caloriesBurned
属性。
const docCalories = newDocs.map((data) => data.caloriesBurned)
或者,如果您愿意,我们可以解构数据并拥有
const docCalories = newDocs.map(({caloriesBurned}) => caloriesBurned)
推荐阅读
- java - 创建名为“entityManagerFactory”的bean时出错调用init方法失败;Spring5.2 x 升级期间
- python - 训练许多神经网络并选择最好的一个
- wordpress - Wordpress(免费)新闻主题
- django - /admin/location __str__ 处的 TypeError 返回非字符串(NoneType 类型)
- reactjs - React-Hooks:如何创建动态可重用数据表组件?
- ruby-on-rails - 在我的本地开发环境中,两个 Rails 应用程序都存在 CSRF 身份验证问题
- typescript - 在 Typescript 中使用类型保护时推断类型
- spring - 为什么@RequestHeader 不适用于@MessageMapping?
- arrays - 如何在具有明确 O(n) 运行时间和内存的未排序数组中找到未配对元素?
- django - Django REST 框架自定义模型权限