Error: "undefined is not an object (evaluating 'password.toString')"

I have two JavaScript files: one has a function that authenticates to an API and the other is a login screen running in the emulator. When I try to authenticate, I get this error:

undefined is not an object (evaluating 'password.toString')

This is the login screen file:

import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity} from 'react-native';
import styles from './login-styles';
import {auth} from '../../fetches/auth';

class LoginBox extends Component {
    constructor(props) {
        super(props)

        this.state = {
            username: '',
            password: ''
        }
    }

    render = () => {
        return(
            <View style={styles.box}>
                <View style={styles.header}>
                    <Text style={{fontSize: 28}}>Bem-vindo ao PostBag v 0.0.2</Text>
                </View>

                <View styles={styles.app}>
                    <TextInput style={styles.square} 
                        keyboardType="numeric" 
                        placeholder='Insira sua matrúcla' 
                        onChangeText={(text) => this.setState({username: text})}
                        value={this.state.username}    
                    />
                    <TextInput style={styles.square} 
                        secureTextEntry
                        placeholder='Insira sua senha' 
                        onChangeText={(text) => this.setState({password: text})}
                        value={this.state.password}
                    />
                    
                    <TouchableOpacity
                        style={styles.button}
                        onPress={() => auth((this.state.username, this.state.password))}
                    >
                        <Text style={styles.buttonTxt}>POST</Text>
                    </TouchableOpacity>
                </View>
            </View>
        )
    }
}

export default LoginBox;

This is the authentication function:

import {Alert} from 'react-native';

export function auth(username, password) {
    fetch('https://suap.ifrn.edu.br:443/api/v2/autenticacao/token/',
    {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'x-csrftoken': 'NDML6yy6HgTUIoypfWMZHMKZ32lgJf5PsNolVnLgewanw5YM4rqwkuvgkyAhEYEA'
        },
        body: JSON.stringify({
            username: username.toString(),
            password: password.toString()
        })
    }).then(function(response) {
        var json = response.json()
        json.then((data) => {
            token = data.token

            if (typeof token === 'undefined') {
                Alert.alert('Não foi possível fazer login')
            }
            else {
                Alert.alert('Login feito com sucesso')
            }
        })
    })
}

I would really appreciate if anyone could help me with this. Everything that I tried did not work.

I think, because of that password or username is null or undefined at that moment. You can check if they are defined and they are strings as below,

body: JSON.stringify({
 username: typeof username === 'string' ? username.toString() : '',
 password: typeof password === 'string' ? password.toString() : ''
})

and your view should be changed as follow,

onPress={() => auth(this.state.username, this.state.password)}