Как правильно принять данные от апи и пройтись map?

Question

[Artem Birds]

Добрый день. Обучаюсь, отправляю запрос на получение данных [] апи и пытаюсь их с помощью метода мап отрисовать в реакте, но пишет что Cannot read property 'map' of undefined. В консоль проверял данные приходят. В чем проблема ?

import React from 'react'

class Grivna extends React.Component{
   
    constructor(props){
        super(props);
        this.state ={
            items: []
        }
    }
    componentDidMount(){
        fetch(`https://bank.gov.ua/NBUStatService/v1/statdirectory/exchange?json`)
        .then(res => res.json())
        .then(
            (result) => {
                this.setState({
                    items: result.items
                })
            }
        )
    }
    

    render(){
        debugger
        const {items} = this.state;

            return(
                <ul>
                    {items.map(item => (
                        <li key={item.id}>{item.txt} {item.cc} {item.exchangedate}</li>
                    ))}
                </ul>
            )
        }
    }   

export default Grivna

Comments

[krka92]

пытаетесь вызвать метод map у undefined

[0xD34F]

items: result.items

Понятно.

Разрешаю вам сделать следующее: посмотреть, чем является result, а затем осознать свою ошибку.

Answer 1

[developerd76]

componentDidMount(){
        fetch(`https://bank.gov.ua/NBUStatService/v1/statdirectory/exchange?json`)
        .then(res => res.json())
        .then(
            (result) => {
                this.setState({
                    items: result
                })
            }
        )
    }

Answer 2

[Александр Черемхин]

В result уже содержатся данные из апи []

componentDidMount(){
        fetch(`https://bank.gov.ua/NBUStatService/v1/statdirectory/exchange?json`)
        .then(res => res.json())
        .then(
            (result) => {
                this.setState({
                    items: result // !!!
                })
            }
        )
    }