react Objects are not valid as a React child (found: object with keys {})问题

今天在写react的时候突然遇到一个问题，在这里记录一下：

   先在组件中定义一个存放后台JSON数据的对象

constructor(props){

super(props);

this.state = {

product : {}

}

}

 

然后从后台获取到的数据为：

{"productname":"Y01","productdescribe":"好东西","productno":"zy1001","productType":"1"}

本想在前台一次性把这些数据全部输出，就直接写了一个{this.state.product}

然后就报错了：

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. in div (at product.js:40) in div (at product.js:39) in Product (created by Context.Consumer) in Route (at top.js:50) in div (at top.js:47) in Router (created by HashRouter) in HashRouter (at top.js:26) in div (at top.js:25) in Top (at src/index.js:10)

 

百度了一下，因为product是一个对象，不能直接输出，若要输出获取到的json，需指出具体的key名，如下：