2016-03-28 10 views
2

これは特有です。配列に.map()エラーを渡す

Iが反応コンポーネントのメソッドをレンダリングするために、単一のオブジェクトからなる配列を渡している:

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"}]

それが1と配列のオブジェクト。

それは結構です、ここに行く:

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

LinkStore私はちょっと問題のあるコードを見つけた:私はUPDATEこのエラー?:

enter image description here

を得ている来る方法.getAll()はまだオブジェクトを持つ配列を返します。

は、その後、次の時間は、我々は、上記の関数を呼び出す: onChange() { console.log('4. In the View', _getAppState()); // this.setState(_getAppState()); }

enter image description here

まだ、完全に確認するとき、どのようにそれを文字列に変換します。あなたがコードを掘り下げて見たい場合は、here is the repo

+2

'はconsole.log(typeof演算this.state.links)'の出力は何ですか? – Pointy

+0

文字列として出てきています! o.O – ilrein

+0

コンパイルされたコードはどのように見えますか? –

答えて

1

サーバーから返される本体は、依然としてJSON文字列です。 JSON文字列でconsole.log()を実行すると、コンソールでエスケープ\が削除されます。値が解析されたと思っていたようですが、実際には値は解析されませんでした。応答でJSON.parse(body)を実行すると、正常に動作するはずです。

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