Index.js：未定義の 'dawgs'プロパティを読み取ることができません

Question

私は、JSONレスポンスでフィードされたindex.jsを使用してグリッドを作成しようとしています。

次のように私のJSON応答は次のとおりです。

{"id":"0-nm7ee1ue9bzjbstn9ygv6lxr","size":29,"price":768,"face":"(.-.)","date":"Mon Jul 31 2017 04:28:45 GMT-0400 (EDT)"} 
{"id":"1-ucdvpte68e22yw7w01j68ncdi","size":23,"price":115,"face":"(.o.)","date":"Sat Aug 05 2017 01:08:36 GMT-0400 (EDT)"} 
{"id":"2-6ev861slycro0temr3vb98jjor","size":13,"price":421,"face":"(`·´)","date":"Sun Aug 06 2017 17:08:18 GMT-0400 (EDT)"} 
{"id":"3-mutgdpkeqipbe2evypfmbzkt9","size":35,"price":6,"face":"(° ͜ ʖ °)","date":"Wed Aug 02 2017 19:30:29 GMT-0400 (EDT)"} 
{"id":"4-fjimlap3tposcqib38lz93sor","size":16,"price":716,"face":"(͡° ͜ʖ ͡°)","date":"Thu Jul 27 2017 02:23:56 GMT-0400 (EDT)"} 
{"id":"5-7qlbahzmtzt77gpsvuh68khuxr","size":18,"price":483,"face":"(⚆ _ ⚆)","date":"Mon Aug 07 2017 21:43:09 GMT-0400 (EDT)"} 
{"id":"6-f8k9eygn92hbzqp0dvx3jo47vi","size":37,"price":757,"face":"(︶︿︶)","date":"Mon Jul 24 2017 07:59:49 GMT-0400 (EDT)"} 
{"id":"7-i816dwwdy3kxv5c0hgz4zpvi","size":24,"price":915,"face":"(ﾟヮﾟ)","date":"Thu Aug 03 2017 04:14:48 GMT-0400 (EDT)"} 
{"id":"8-w06tgl269c8qckt4j7vdq85mi","size":29,"price":309,"face":"(\\/)(°,,,°)(\\/)","date":"Thu Jul 27 2017 04:11:38 GMT-0400 (EDT)"} 
{"id":"9-jy6zjva7bdc2wl9vl05zpk3xr","size":21,"price":620,"face":"(¬_¬)","date":"Tue Jul 25 2017 13:54:51 GMT-0400 (EDT)"} 

私は次の内容のindex.jsファイル作成：私は次のようなエラーに遭遇してい

import axios from 'axios'; 

export const RECEIVE_DAWGS = 'RECEIVE_DAWGS'; 

function receiveDawgs(json){ 
    const{dawgs} = json.data; 
    return{ 
    type: RECEIVE_DAWGS, 
    dawgs 
    } 
} 

function fetchDawgsJson(){ 
    return axios.get('http://localhost:8000/api/products', {responseType: 'stream'}) 
    .then(({data}) => { 
    const xdjson = data.split('\n').slice(0, -1) 
    const json = xdjson.map((item, i) => JSON.parse(item)) 
    return json 

    }) 

} 

export function fetchDawgs(){ 
    return function(dispatch){ 
    return fetchDawgsJson() 
    .then(json => dispatch(receiveDawgs(json))) 
    } 
} 

を：

Uncaught (in promise) TypeError: Cannot read property 'dawgs' of undefined 
    at receiveDawgs (index.js:5) 
    at index.js:27 
    at <anonymous> 

このようにindex.jsを書くと：

export const RECEIVE_DAWGS = 'RECEIVE_DAWGS'; 

function receiveDawgs(json){ 
    const{dawgs} = json.data; 
    return{ 
    type: RECEIVE_DAWGS, 
    dawgs 
    } 
} 

function fetchDawgsJson(){ 
    return fetch('http://localhost:8000/api/products') 
    .then(response => 
     response.json() 

) 

} 

export function fetchDawgs(){ 
    return function(dispatch){ 
    return fetchDawgsJson() 
    .then(json => dispatch(receiveDawgs(json))) 
    } 
} 

私は、次のようなエラーに遭遇しています：この予期しないトークンエラーで

localhost/:1 Uncaught (in promise) SyntaxError: Unexpected token { in JSON at position 126 

を、その文字の位置が正確にJSONレスポンスの2番目の項目の初めであることに注意してください。

私はこのような1つの項目に応じて制限するfetchDawgsJsonを変更する場合：

Uncaught (in promise) TypeError: Cannot read property 'dawgs' of undefined 
    at receiveDawgs (index.js:3) 
    at index.js:23 
    at <anonymous> 

私は」確信している：

function fetchDawgsJson(){ 
    return fetch('http://genie:8000/api/products?limit=1') 
    .then(response => 
     response.json() 

) 

} 

をaxiosを使用するときのように、私は同じエラーが発生します何か間違っている。 アドバイスや洞察力がありがとうございます。ありがとうございました。

Answer 1

これは無効なJSONです。

使用すると、オブジェクトの束を出力している - 彼らは

さらに、アレイにラップする必要がある、あなたは、応答が含意があることである

const{dawgs} = json.data; 

dawgsプロパティを持つオブジェクトを持っていると仮定します

{ 
    "dawgs": [ 
{"id":"0-nm7ee1ue9bzjbstn9ygv6lxr","size":29,"price":768,"face":"(.-.)","date":"Mon Jul 31 2017 04:28:45 GMT-0400 (EDT)"}, 
{"id":"1-ucdvpte68e22yw7w01j68ncdi","size":23,"price":115,"face":"(.o.)","date":"Sat Aug 05 2017 01:08:36 GMT-0400 (EDT)"}, 
     .... more 
    ] 
} 

、あなたがresponseType: 'stream'を持っている場合、最終的に、応答上のデータの小道具は、ストリームが含まれます：データが通り到着しています。あなたはサーバー上でAxiosを使用していますか？