javascript - 我的 const 变量 ul 返回未定义的数组而不是返回对象数组，我怎样才能让代码返回一个数组

Question

我找到了一种将列表项放入数组的方法，该数组可以使用这段代码映射到其不同的 ul 组件中

const ul = Object.entries(props.allshop).map(([item, list, index]) => {
  [...Array(Object.keys(list))].map((newItem, index) => {
    return (
      <BuildControl key={index} item={newItem} title={item}></BuildControl>
    );
  });
});

但是，我仍然有一个问题，因为 ul 像这样返回 undefined 作为数组的值

{console.log(ul)} = [undefined, undefined, undefined, undefined, undefined] 

我尝试在我的 BuildControl 组件上运行 console.log，它返回了我期望的对象，如下所示：

console.log(
  <BuildControl key={index} item={newItem} title={item}></BuildControl>
);

显示正确映射的数组

现在我的挑战是如何让 ul 返回这个 buildControl 的值而不是 undefined

标签： javascriptarraysreactjsreturn

Answer 1

您忘记返回外部 map 函数的结果。你可以有一个明确的回报，如下所示

const ul = Object.entries(props.allshop).map(([item, list, index]) => {
  return [...Array(Object.keys(list))].map((newItem, index) => {
    return (
      <BuildControl key={index} item={newItem} title={item}></BuildControl>
    );
  });
});

或隐式返回，例如

const ul = Object.entries(props.allshop).map(([item, list, index]) => 
       [...Array(Object.keys(list))].map((newItem, index) => {
        return (
          <BuildControl key={index} item={newItem} title={item}></BuildControl>
        );
      });
    );