Почему значения из ввода не отправляются в API - PullRequest
1 голос
/ 13 февраля 2020

Мне нужно передать values из TextInput в API, но у меня есть этот объект ниже, взятый из console.log:

Object {
  "__v": 0,
  "_id": "5e4422f5c6fc7b323c71db52",
}

Он пуст. Я не знаю, что я делаю не так. Я использую Node.js с Express и Ax ios на Backend.

import React, { useState } from 'react';
import { View, Text, TextInput, StyleSheet, TouchableOpacity } from 'react-native';

import api from '../services/api';

function CadastroChild({ navigation }){

    const [name, setName] = useState('');
    const [idade, setIdade] = useState('');
    const [peso, setPeso] = useState('');
    const [comprimento, setComprimento] = useState('');
    const [temperatura, setTemperatura] = useState('');

    async function addChild(e){
        e.preventDefault();

        const response = await api.post('/children', {
            name,
            idade,
            peso,
            comprimento,
            temperatura
        })

        console.log(response.data);

    }

    return(
        <View style={styles.container}>
        <View style={styles.childForm}>
            <Text style={styles.textInput}>Nome Completo:</Text>
            <TextInput 
                style={styles.childInput}
                placeholder="Nome da criança"
                placeholderTextColor="#999"
                autoCapitalize="words"
                autoCorrect={false}
                required
                value={name}
                onChange={e => setName(e.target.value)}
            />
            <Text style={styles.textInput}>Idade:</Text>
            <TextInput 
                style={styles.childInput}
                placeholder="Digite a idade"
                placeholderTextColor="#999"
                keyboardType="numeric"
                required
                value={idade}
                onChange={e => setIdade(e.target.value)}
            />
            <Text style={styles.textInput}>Peso (kg):</Text>
            <TextInput 
                style={styles.childInput}
                placeholder="Digite o peso"
                placeholderTextColor="#999"
                keyboardType="numeric"
                required
                value={peso}
                onChange={e => setPeso(e.target.value)}
            />
            <Text style={styles.textInput}>Comprimento (m):</Text>
            <TextInput 
                style={styles.childInput}
                placeholder="Digite o comprimento"
                placeholderTextColor="#999"
                keyboardType="numeric"
                required
                value={comprimento}
                onChange={e => setComprimento(e.target.value)}
            />
            <Text style={styles.textInput}>Temperatura (ºC):</Text>
            <TextInput 
                style={styles.childInput}
                placeholder="Digite a temperatura"
                placeholderTextColor="#999"
                keyboardType="numeric"
                required
                value={temperatura}
                onChange={e => setTemperatura(e.target.value)}
            />
        </View>
        <View style={styles.viewButton}>
            <TouchableOpacity 
                style={styles.goButton}
                onPress={() => { 
                    addChild();
                    navigation.navigate('Menu'); 
                }} 
            ><Text style={styles.textButton}>Cadastrar</Text>
            </TouchableOpacity>
        </View>
        </View>

    );
}

const styles = StyleSheet.create({...})

export default CadastroChild;

Я недавно использую React Native и Node.js.

...