访问钩子的数据-React

克里斯尤弗

我请求此API,然后将结果保存在“数据”挂钩中。当我想打印“ data.total_results”时一切正常,但是当我要打印内部包含更多数据的键时,则不会留下“ Data.results [0] .title”

import React, { useState, useEffect } from 'react';

const Movie = () => {
  // Declara una nueva variable de estado, que llamaremos "count".
  const [Data, setData] = useState("");

  useEffect(() => {
    const Cargar = async () => {
      let respuesta = await fetch("https://api.themoviedb.org/3/discover/movie?api_key=ce322f54257cc9286282b320c5e9b2a0&language=en-US&sort_by=popularity.desc&include_adult=false&include_video=false&page=1");
      let respuestaJSON = await respuesta.json();
      setData(respuestaJSON);
    };
    Cargar();
  }, [Data]);
  return (
    <div>
      {Data.total_results}
      {/* {Data.results[0].title} */}
    </div>
  );
}

export default Movie;
jogesh_pi

您需要检查results属性是否已定义。

<div className="App">
  <h1>Total {Data.total_results}</h1>
  {typeof Data.results !== "undefined" &&
    Data.results.map((movie, index) => {
      return <h3>{movie.title}</h3>;
    })}
</div>

工作演示https : //codesandbox.io/s/distracted-feather-4l55r

几天前,我创建了一个存储库并使用React实现了OMDB API。这可能对您有帮助。

https://github.com/jogeshpi03/omdb-react

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

React React钩子访问闭包变量

来自分类Dev

如何从React钩子访问功能组件的名称?

来自分类Dev

我如何通过React访问useEffect钩子内置的数组?

来自分类Dev

使用自定义的React钩子获取数据

来自分类Dev

使用React钩子将数据传递到同级组件?

来自分类Dev

在获取数据后如何设置状态React钩子

来自分类Dev

React.js useState钩子不更新Promise数据

来自分类Dev

使用 React 钩子,为什么获取的数据未定义?

来自分类Dev

React钩子重复的react包

来自分类常见问题

React的useEffect钩子如何访问其下定义的所有函数表达式?

来自分类Dev

如何在React函数组件(useState钩子)中访问ag-Grid API?

来自分类Dev

React钩子被乱序调用

来自分类Dev

React Context API +钩子

来自分类Dev

useState react钩子

来自分类Dev

来自React钩子的故障?

来自分类Dev

从React组件访问通用功能/数据

来自分类Dev

如何从React中的子标签访问数据

来自分类Dev

React:从组件中的Redux访问数据

来自分类Dev

在React中访问数据的最佳方法

来自分类Dev

使用React钩子时如何避免两次获取数据

来自分类Dev

如何使用React钩子将获取的数据作为道具传递给组件?

来自分类Dev

无法在React中使用useEffect钩子将json服务器数据连接到数组中

来自分类Dev

React钩子异步问题:映射在返回数据之前正在执行-解决方案?

来自分类Dev

使用React钩子时如何避免两次获取数据

来自分类Dev

如何使用React钩子将数据从父级传递给子级

来自分类Dev

React:实现一个钩子来获取数据并返回加载状态

来自分类Dev

如何使用指定了默认自定义钩子的组件接口访问React Router历史记录对象

来自分类常见问题

React钩子-onFocus和onBlur

来自分类Dev

React-Router onChange钩子

Related 相关文章

  1. 1

    React React钩子访问闭包变量

  2. 2

    如何从React钩子访问功能组件的名称?

  3. 3

    我如何通过React访问useEffect钩子内置的数组?

  4. 4

    使用自定义的React钩子获取数据

  5. 5

    使用React钩子将数据传递到同级组件?

  6. 6

    在获取数据后如何设置状态React钩子

  7. 7

    React.js useState钩子不更新Promise数据

  8. 8

    使用 React 钩子,为什么获取的数据未定义?

  9. 9

    React钩子重复的react包

  10. 10

    React的useEffect钩子如何访问其下定义的所有函数表达式?

  11. 11

    如何在React函数组件(useState钩子)中访问ag-Grid API?

  12. 12

    React钩子被乱序调用

  13. 13

    React Context API +钩子

  14. 14

    useState react钩子

  15. 15

    来自React钩子的故障?

  16. 16

    从React组件访问通用功能/数据

  17. 17

    如何从React中的子标签访问数据

  18. 18

    React:从组件中的Redux访问数据

  19. 19

    在React中访问数据的最佳方法

  20. 20

    使用React钩子时如何避免两次获取数据

  21. 21

    如何使用React钩子将获取的数据作为道具传递给组件?

  22. 22

    无法在React中使用useEffect钩子将json服务器数据连接到数组中

  23. 23

    React钩子异步问题:映射在返回数据之前正在执行-解决方案?

  24. 24

    使用React钩子时如何避免两次获取数据

  25. 25

    如何使用React钩子将数据从父级传递给子级

  26. 26

    React:实现一个钩子来获取数据并返回加载状态

  27. 27

    如何使用指定了默认自定义钩子的组件接口访问React Router历史记录对象

  28. 28

    React钩子-onFocus和onBlur

  29. 29

    React-Router onChange钩子

热门标签

归档