對象是無效的陣營

這是我app.js對象是無效的陣營

import React from 'react' 
import { render } from 'react-dom' 
import { Router, Route, IndexRoute, browserHistory } from 'react-router' 

const App = ({ children }) => (
    <div> 
    {children} 
    </div> 
) 

import Index from './index' 
import Weatherhbh from './weatherhbh' 

render((
    <Router history={browserHistory}> 
    <Route path="widget/" component={App}> 
     <IndexRoute component={Index}/> 
     <Route path="hbh/" component={Weatherhbh}/> 
    </Route> 
    </Router> 
), document.getElementById('app'))

，這是我的HBH組件

import React from 'react' 
import axios from 'axios' 

const urlP=`/hourly`; 

export default class App extends React.Component { 
    constructor(props){ 
     super(props); 
     this.state={ 
     data:[] 
     }; 
    } 
    componentDidMount() { 
     axios.get(urlP) 
       .then(response => { 
       console.log(response.data,"this is response") 
       this.setState({ 
       data:response     
       }); 
      }); 
     } 


    render() { 
    return(<div> 

      <p>{this.state.data}</p> 

    </div> 
    ) 
    } 
}

，我得到這個錯誤

bundle.js:1244 Uncaught (in promise) Error: Objects are not valid as a React child (found: object with keys If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of App .(…)

怎麼可以修復它，以便我可以顯示來自後端的所有數據？

來源

2017-02-16 mary

返回的數據的形狀是什麼？ –

是什麼意思？如果你的意思是類型的od fata我發送它json – mary

是的，所以你是在你的狀態設置一個json對象的數據權利？你不能直接渲染對象，你必須對它做一些處理。您想要顯示哪些數據中的信息？ –

this.setState({ 
    data:response     
});

這部分代碼這裏分配響應（一個對象）到狀態變量data然後：

<p>{this.state.data}</p>

嘗試過渲染對象，但反應不知道如何渲染對象。爲了讓您的數據使用：

<p>{this.state.data.data}</p>

因爲現在data=response與愛可信的響應有一個名爲data持有實際的數據屬性。如果數據同時也是一個對象（json數據），您將必須訪問特定的關鍵字，例如

this.state.data.data.username

來源

2017-02-16 10:48:41 finch

對象是無效的陣營

回答

相關問題