Javascript 如何在ReactJS中获取嵌套JSON数据

我正在使用axios从api获取数据。 我的路由器是：

<Route exact path='/device/:id/update' render={(props) => <DeviceTypeUpdate {...props} />} />

在我的render方法中，我尝试在console中记录数据，如下所示：

const {error, isLoaded, devicetype} = this.state
console.log('----error----', error);
console.log('----devicetype in render----', devicetype.data);

assignment_date: {$date: 1548744545634}
device_elements: {type: "switch", name: "board", state: "some state"}
dev_stage: "PLANNING"
type_description: "some description"
type_name: "Board"
_id: 1

devicetype.data打印出包含嵌套数据的JSON对象，如下所示：

const {error, isLoaded, devicetype} = this.state
console.log('----error----', error);
console.log('----devicetype in render----', devicetype.data);

assignment_date: {$date: 1548744545634}
device_elements: {type: "switch", name: "board", state: "some state"}
dev_stage: "PLANNING"
type_description: "some description"
type_name: "Board"
_id: 1

当我输入console.log（devicetype.data.device_元素）或任何其他属性时 它抛出一个错误

“TypeError:无法读取未定义的属性'type\u name'”

---

我做错了什么。请帮助我

在访问嵌套对象之前，您需要执行条件检查，如

   if(devicetype.data){
       console.log(devicetype.data.device_elements);
       console.log(devicetype.data.type_name);
   }

---

此.state.devicetype的初始值是多少？我猜您的组件是在响应axios调用而设置的
this.state.devicetype.data
之前进行渲染的，因此初始渲染尝试访问一个不存在的对象。@christian我的this.state.devicetype的初始值是{}空对象。如果我的组件是在“this.state.devicetype.data”之前进行渲染的设置为axios调用。那我该怎么解决呢？这取决于你希望你的用户界面如何处理这种情况。通常这种行为是可取的，因为它使您有机会在加载数据时显示“正在加载…”消息，否则在加载数据之前组件将不会呈现。您可以将if语句添加到
render（）
函数中，以处理尚未加载数据的情况。在伪代码中：
if（dataIsNotLoaded）displayingmessage else displayData
此方法有效。您能解释一下为什么在访问嵌套对象之前必须进行条件检查吗。感谢您，因为devicetype.data在初始渲染时未定义或为null，但您直接访问devicetype.data.type\u名称，因为在初始渲染时devicetype.data未定义，因此该名称将不起作用