From 432a8b70414632b1f59900b173a342ab9586ae68 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Rodr=C3=ADguez?= <36035218+GermanRodrickson@users.noreply.github.com> Date: Fri, 25 Oct 2019 10:11:41 +0200 Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=8E=A8=20-=20formating=20code=20of=20?= =?UTF-8?q?README.md?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 35 +++++++++++++++++++---------------- 1 file changed, 19 insertions(+), 16 deletions(-) diff --git a/README.md b/README.md index c9e6a9d..6c8ca5b 100644 --- a/README.md +++ b/README.md @@ -7,6 +7,7 @@ Also can handle errors and loading state. ## Why useFetch? With this hook, you can get a json data from an url and handle the following variables: + - Fetched data. - Loading boolean. - Error data. @@ -39,16 +40,15 @@ const YourComponent = props => { Optional, you can send personal settings as second parameter: - ```javascript const headers = new Headers(); const options = { - method: 'GET', - headers, - mode: 'cors', - cache: 'default', - ...more + method: 'GET', + headers, + mode: 'cors', + cache: 'default', + ...more }; ``` @@ -62,19 +62,22 @@ export default () => { const { data, loading, error } = useFetch('https://pokeapi.co/api/v2/pokemon', {}); const getData = () => { - if (error.status) return
  • Error: {error.message}

  • ; - if (loading) return
  • Loading...

  • ; - if (data.results) return data.results.map((poke, i) =>
  • {poke.name}

  • ); - } + if (loading) { + return

    Loading...

    ; + } + if (error.status) { + return

    Error: {error.message}

    ; + } + if (data.results) { + return data.results.map((poke, i) =>

    {poke.name}

    ); + } + }; return (

    Test

    - + {getData()}
    ); - -} -``` \ No newline at end of file +}; +``` From 446dd15996575ea28ffd7238f7d8f16aba3c727b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Germ=C3=A1n=20Rodr=C3=ADguez?= <36035218+GermanRodrickson@users.noreply.github.com> Date: Thu, 31 Oct 2019 09:36:30 +0100 Subject: [PATCH 2/2] :ok_hand: - add the situation when data have 0 results --- README.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/README.md b/README.md index 6c8ca5b..6eb9571 100644 --- a/README.md +++ b/README.md @@ -68,6 +68,9 @@ export default () => { if (error.status) { return

    Error: {error.message}

    ; } + if (!data.results) { + return

    No data results

    ; + } if (data.results) { return data.results.map((poke, i) =>

    {poke.name}

    ); }