Question

诚然，学习react＆jsx，但是我一生无法弄清为什么它不呈现：

function generateItem(item){
  return `<li><a href=${item.url}>${item.text}</a></li>`;
}

function MyList ({items}){
  return (
      <div className="list">
        <ul>
          {items.forEach(item => {
            generateItem(item);
          })}
        </ul>
      </div>
  );
};

输出的所有内容（当包含在我的应用中时）是一个空列表：

<div class="list"><ul></ul></div>

我确定这是基本和根本的事情。但是我在那里。

https://codesandbox.io/s/relaxed-stallman-81ety

Answer 1

items.forEach不会返回任何内容... jsx中大括号内的内容最终会在调用React.createElement时转换为参数，因此它们必须是一个表达式并返回一个值。（在此处检查transpiled version）

尝试使用items.map(item => generateItem(item))或直接使用items.map(generateItem)。

这是您的代码已编辑（我还更改了generateItem以返回jsx而不是字符串）

https://codesandbox.io/s/frosty-sutherland-fp7kh

为什么不返回函数返回的数据？

1 个答案: