Ответ от Fetch () не определен

Question

Есть два файла: RegistrationScreen.js и api.js .

Внутри api.js Я работаю fetch() function:

export const fetchAllUsers = () => {
    fetch(`http://${localIP}:${port}/api/userData`)
        .then(res => res.json()) 
        /* .then(json => console.warn('JSON: ' + json.userData[0].username))
        .catch(e => console.warn('ERROR: ' + e)) */
}

Если прокомментировать второй .then() Я смогу увидеть имя пользователя из ответа.

Я импортирую эту функцию в RegistrationScreen.js :

import { fetchAllUsers } from '../../constants/api';

export default class RegistrationScreen extends Component{

    static defaultProps = {
        fetchAllUsers
    }

    onCreateButtonPress = async () => {
        ...
        let usernameValidation = await this.checkUsernameUniqueness();
        ...
    }

    checkUsernameUniqueness = async () => {
        const data = await this.props.fetchAllUsers();
        console.warn('user = ' + data)
    }
    ...

}

И в результате я получаю в консоли user = undefined .Почему я вижу данные внутри api.js , а не в RegistrationScreen.js ?

UPDATE_1

Если сделатьconsole.warn(this.props.fetchAllUsers) внутри RegistrationScreen.js Я вижу код функции, поэтому функция видна.

Answer 1

Проблема в том, что когда вы звоните fetchAllUsers, вы ничего не получаете от него, поэтому вы получаете undefined.Функция без return возвращает неопределенное значение.

Возвращает undefined

export const fetchAllUsers = () => {
    fetch(`http://${localIP}:${port}/api/userData`)
        .then(res => res.json()) 
        /* .then(json => console.warn('JSON: ' + json.userData[0].username))
        .catch(e => console.warn('ERROR: ' + e)) */
}

Возвращает обещание

export const fetchAllUsers = () => {
    // added return 
    return fetch(`http://${localIP}:${port}/api/userData`)
        .then(res => res.json())
}

Вы забыли вернуть обещание отfetch