Formmahasiswa-React Native

import React, { Component } from 'react';
import {
    StyleSheet,
    Text, TextInput, Touchable, TouchableOpacity, View, Alert
} from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import Icon from 'react-native-vector-icons/FontAwesome5';


class Formmahasiswa extends Component {
    constructor(props) {
        super(props);
        this.state = {
            nobp: '', nama: '', alamat: '', telp: '',
        };
    }
    saveDataMhs = () => {
        fetch('http://192.168.229.65/api-server/public/mahasiswa', {
            method: 'POST',
            headers: {
                Accept: 'application/json',
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                mhsnobp: this.state.nobp,
                mhsnama: this.state.nama,
                mhsalamat: this.state.alamat,
                mhstelp: this.state.telp,
            })
        })
            .then((response) => response.json())
            .then((json) => {
                (json.status == 201) ? Alert.alert('Sukses', 'data mahasiswa berhasil disimpan') : '';
            })
            .catch((err) => console.log(err))
            .finally(() => {
                this.setState({ nobp: '' });
                this.setState({ nama: '' });
                this.setState({ alamat: '' });
                this.setState({ telp: '' });
            })
    }
    render() {
        return (
            <View style={style.container}>
                <LinearGradient colors={['#200122', '#6f0000']} style={style.header} start={{ x: 0, y: 0 }} end={{ x: 1, y: 0 }}>

                    <TouchableOpacity
                        onPress={() => this.props.navigation.goBack()}
                    >
                        <Text style={{ paddingLeft: 15 }}>
                            <Icon name="arrow-circle-left" size={30} color="#fff" />
                        </Text>
                    </TouchableOpacity>

                    <Text style={style.textHeader}>
                        Form Mahasiswa Mahasiswa
                    </Text>
                    <Text></Text>
                </LinearGradient>

                <View style={style.isi}>
                    <View style={{
                        flex: 1, paddingHorizontal: 10,
                        marginTop: 20
                    }}>
                        <TextInput
                            value={this.state.nobp}
                            onChangeText={(value) => this.setState({ nobp: value })}
                            placeholder='Inputkan No.BP'
                            placeholderTextColor='#200122'
                            style={style.textInput}
                            keyboardType="number-pad"
                        />
                        <TextInput
                            value={this.state.nama}
                            onChangeText={(value) => this.setState({ nama: value })}
                            placeholder='Inputkan Nama Lengkap'
                            placeholderTextColor='#200122'
                            style={style.textInput}
                        />
                        <TextInput
                            value={this.state.alamat}
                            onChangeText={(value) => this.setState({ alamat: value })}
                            placeholder='Inputkan Alamat'
                            placeholderTextColor='#200122'
                            style={style.textInput}
                        />
                        <TextInput
                            value={this.state.telp}
                            onChangeText={(value) => this.setState({ telp: value })}
                            placeholder='Inputkan No.Telp'
                            placeholderTextColor='#200122'
                            style={style.textInput}
                            keyboardType="number-pad"
                        />

                        <TouchableOpacity style={style.tombolSimpan}
                            onPress={() => this.saveDataMhs()}
                        >
                            <Text>
                                <Icon name="save" size={30} color="#fff" />
                            </Text>
                            <Text
                                style={{ color: '#fff', fontSize: 18, fontWeight: 'bold', paddingLeft: 10 }}
                            >Simpan Data</Text>
                        </TouchableOpacity>
                    </View>

                </View>
            </View>
        );
    }
}

export default Formmahasiswa;

const style = StyleSheet.create({
    container: { flex: 1, backgroundColor: '#fff' },
    header: {
        flex: 0.5,
        backgroundColor: 'red',
        borderBottomLeftRadius: 60,
        borderBottomRightRadius: 60,
        justifyContent: 'space-between',
        alignItems: 'center',
        flexDirection: 'row',
        elevation: 10
    },
    textHeader: {
        color: '#fff',
        fontSize: 22,
        fontWeight: 'bold'
    },
    isi: {
        backgroundColor: '#fff',
        flex: 3,
    },
    textInput: {
        borderWidth: 2,
        borderColor: '#200122',
        paddingHorizontal: 20,
        borderRadius: 10,
        backgroundColor: '#fff',
        elevation: 5,
        marginVertical: 10
    },
    tombolSimpan: {
        backgroundColor: '#200122',
        flexDirection: 'row',
        borderRadius: 10,
        paddingVertical: 15,
        justifyContent: 'center',
        alignItems: 'center',

    }
})