javascript - 功能组件和对象值

Question

我正在做一个业余项目，并且正在努力打印对象值。

我的代码布局如下:

基于类的组件

this.state = {
  itemDetails: []
};

axios.get(`${ROOT_URL}/${itemId}?${API_KEY}`).then(res => {
  console.log(res.data);
  this.setState({ itemDetails: res.data })
});

返回此 json 数据

然后我有一个功能组件

    const MovieDetails = (props) => {
  const arrayofKey = Object.values(props.itemDetails).map((r) => (
    <div>
      <a href='#t' className='item-name'>{r.original_title}</a>
    </div>
  ))
  return <div className='item-details'>{arrayofKey}</div>
}

这意味着返回original_title(Aquaman)的值，但是我收到错误“TypeError:无法读取null的属性'original_title'”

如有任何帮助，我们将不胜感激

Answer 1

以下内容足以仅显示标题。

const MovieDetails = (props) => {
  const {itemDetails} = props; 
  return (
    <div className='item-details'>
      <a href='#t' className='item-name'>{itemDetails.original_title}</a>
    </div>
  );
}