javascript - 无法显示从后端作为对象接收的数据，

Question

我正在从后端获取数据，它有一个名为 headers 的特定子部分，它还有一个附加的 name:value 对 。 像这样 - data : { headers : {name:"Nishant", value:"random"} }，我想显示模态中的所有字段，当我尝试使用 Object 时.keys() ，抛出此错误 - “无法将 undefined 或 null 转换为对象”。

render(){
 return(
   let request_data = this.props.head // has the entire data
   let data = request_data.headers //contains the headers section to be displayed.
   <div className="modal-body">
            <div className="row">
              <div className="col-lg-6">
              {
                <div>
                  {// want to display the headers data here }
                  { (request_data.body !== '') ? <div>Body : {request_data.body}</div> : ''}
                </div>
              }
              </div>
           </div>
    </div>
 );
}

不确定该怎么做，因为我尝试使用Object.keys，但抛出一个错误，提示“无法将未定义或空值转换为对象”。虽然通过使用 JSON.stringify() 我得到了结果，但不是预期的外观和感觉。

Answer 1

在获取值之前检查 header 是否未定义；

            <div className="col-lg-6">
                {
                    <div>
                        {request_data.header ? Object.values(request_data.header).map(value => value) : null}

                        {(request_data.body !== '') ? <div>Body : {request_data.body}</div> : ''}
                    </div>
                }
            </div>