时间戳

首页 > 解决方案 > 通过 nodeList 映射

reactjs - 通过 nodeList 映射

问题描述

所以，我在使用 map() 时遇到了问题。我不知道为什么，但我只有最后一次上市。

let myOptions = {};
const getList = test=> some.current.querySelectorAll(test);

//that will generete nodeList
const list = getList('.list-for-test a');

所以如果我这样映射（我得到了所有的倾听）：

Array.from(list).map((e) => console.log(e))

但如果我想从我的收藏中添加一些数据，如下所示：

Array.from(list).map(el => myOptions= {...myOptions, ...{'html': e.innerText, 'href': e.href)

和

console.log(myOptions)

只会给我最后一个输出...

知道我在哪里犯了错误吗？

我需要实现的目标： 1. 收集数据 2. 传递数据

<>
{content ? {myOptions.map((e) =><importedElement href={e.href} html={e.html}/>)} : <Component {...props} />}
</>

标签： reactjsecmascript-6

解决方案

myOptions只是一个变量，一个值。每次分配它时，它都会覆盖以前的值。.map(el => {...myOptions, ...{'html': e.innerText, 'href': e.href)如果你想列出一个清单，就这样做。我假设myOptions是在.map. Map 在给定数组上循环，并构建一个新数组，该数组是每个数组返回的结果。我认为你的问题是你试图像each. 例如

给定一个数组： var arr = [1, 2, 3, 4]

var newArr = arr.map((val) => val + 1)

这会循环每个值，加一个并将该值返回到新数组，该数组由 map 方法返回并存储在newArr.

如果您真的想按照自己的方式进行操作，则需要制作myOptions和排列并将值推送到其中。看起来像这样：

var myOptions = [] list.forEach(val => myOptions.push({'html': e.innerText, 'href': e.href})

但你应该只使用地图。

编辑：因此，根据您的编辑，您需要这样做：

const getList = test=> some.current.querySelectorAll(test);

const list = getList('.list-for-test a');

list = list.map(elem => {'html': elem.innerText, 'href': e.href})

只是为了澄清

推荐阅读