将数组传递给.map（）错误

Question

这很奇怪。

我将一个由单个对象组成的数组传递给React组件的Render方法：

let content = this.state.links.map(link => { // eslint-disable-line
  return (
    <li key={link._id}>
      <a href={link.link}>{link.title}</a>
    </li>
  );
});

return (
  <h3>
    <ul>
      {content}
    </ul>
  </h3>
);

这是this.state.links：

的输出

[{"_id":"56f9b418657c2d2353611b0f","link":"https://facebook.github.io/flux/","title":"flux"}]

这是一个包含一个对象的数组。我怎么会收到这个错误？：

更新：我找到了有问题的代码：

进入这里很好：

const _getAppState = () => { // eslint-disable-line return { links: LinkStore.getAll(), }; };

LinkStore.getAll（）仍返回带有对象的数组。

然后下次我们调用上面的函数： onChange() { console.log('4. In the View', _getAppState()); // this.setState(_getAppState()); }

仍不完全确定何时以及如何将其转换为字符串。如果您想深入了解代码并亲眼看看here is the repo。

Answer 1

服务器的返回体仍然是JSON字符串。通过对JSON字符串执行console.log（），可以在控制台中删除转义\。看起来你认为价值被解析了，但实际上并非如此。在响应上运行JSON.parse（body），它应该可以工作。

示例：https://jsbin.com/bomehafeki/1/edit?js,console