React the native code style needs to be improved (render () takes a long time)

I use Expo to create an application and this part of my application loads the longest. I use Soap to get data (dates), then I print a week, and then I associate it to the data. The problem is that I have to reload a few times for the data to be displayed in my opinion. The value shows in console.logbut not in return() so I have to use this.state.counter to do it a few more times for the data to show. I am new to this field so I ask for directions. Thank you!

import React from "react" & # 39;
import {View, Text, TouchableOpacity, RefreshControl, ScrollView,
AsyncStorage, Alert} of & # 39; react-native & # 39 ;;
import the "react-native-vector-icons / FontAwesome & # 39 ;;
import {widthPercentageToDP as wp, heightPercentageToDP as hp} since <react-
native answer screen;

The RegisterAppointmentsDate class extends React.Component {
navigationStatic options = {
title: "Registruotis vizitui data",
};
constructor (accessories) {
super (accessories);
this.state = {
doctorName: null,
id: null,
dv_id: null,
day: 0,
timeList: null,
refreshing: false,
secondrefresh: false,
qualifiersList: null,
DoctorProfession: null,
counter: 0,
closestDate: null,
isCancelled: false

}
this.reRenderSomething = this.props.navigation.addListener (& # 39; willFocus & # 39 ;,) => {

});
}
_onRefresh = () => {
this.setState ({refreshing: true});
function dates (current) {
var week = new Array ();
current.setDate ((current.getDate () - current.getDay () +1));
for (var i = 0; i < 7; i++) {
            week.push(
                new Date(current)
            ); 
            current.setDate(current.getDate() +1);
        }
        return week; 
    }
    AsyncStorage.getItem('doctorName', (err, results) => {
this.setState ({doctorName: results});
});
AsyncStorage.getItem (Doctor DoctorProfession #, (err, results) => {
this.setState ({doctorProfession: results});
});
AsyncStorage.getItem (& # 39; DV_ID & # 39 ;, err, results) => {
this.setState ({dv_id: results});
});
AsyncStorage.getItem (& # 39; AkcijosPaslauga & # 39 ;, (err, results) => {
this.setState ({akcijosPaslauga: results});
});
AsyncStorage.getItem ("nearest year", (err, nuo) => {
this.setState ({mostDate: nuo});
});
if (this.state.counter < 1){
    AsyncStorage.getItem('SK_ID', (err, results) => {
var soap = require (& # 39; soap-everywhere & # 39;);
var url = & # 39; xxx & # 39 ;;
let skId = parseInt (JSON.parse (results));
let asmId = parseInt (JSON.parse (this.state.id));
let specId = parseInt (JSON.parse (this.state.akcijosPaslauga));
this.setState ({skID: skId});
var args = {code: xxxxx, asm_id: asmId, sk_id: skId, specId: specId};
soap.createClient (url, function (err, client) {
client.mGetSpecialybes (arguments, function (err, result) {
AsyncStorage.setItem ('Qualifications', JSON.stringify (result.mGetSpecialybesResult[0].diffgram.NewDataSet.Specialybes), () => {
AsyncStorage.mergeItem (& # 39; Qualifications & # 39; JSON.stringify (result.mGetSpecialybesResult[0].diffgram.NewDataSet.Specialybes), () => {
AsyncStorage.getItem (& # 39; Qualifications & # 39 ;, err, results) => {

});
});
});
});
});
});
}
AsyncStorage.getItem (& # 39; Qualifications & # 39 ;, err, results) => {
this.setState ({qualifitionsList: results});
});
if (this.state.counter < 1){  
    AsyncStorage.getItem('UserId', (err, asm_id) => {
var soap = require (& # 39; soap-everywhere & # 39;);
let dvId = parseInt (JSON.parse (this.state.dv_id));
let asmId = parseInt (JSON.parse (asm_id));
var url = & # 39; xxx & # 39 ;;
var today = new Date (parseInt (this.state.closestDate.slice (1,5)), parseInt (this.state.closestDate.slice (6,8) -1), parseInt (this.state.closestDate.slice ( 9.11)));
var a = dates (new Date (today.getFullYear (), today.getMonth (), today.getDate () + this.state.day));
let data = JSON.stringify (a[0])
leave dataIki = JSON.stringify (a[6])
var args = {code: xxxx, asm_id: asmId, data: data.slice (1,11), dataIki: dataIki.slice (1,11), kodai: dvId};
soap.createClient (url, function (err, client) {
client.mGetLaisviLaikai (arguments, function (err, result) {
AsyncStorage.setItem (& # 39; Times & # 39 ;, JSON.stringify (result.mGetLaisviLaikaiResult[0].diffgram.NewDataSet.Gydytojai), () => {
AsyncStorage.mergeItem (& # 39; Times & # 39 ;, JSON.stringify (result.mGetLaisviLaikaiResult[0].diffgram.NewDataSet.Gydytojai), () => {
AsyncStorage.getItem (& # 39; Times & # 39 ;, err, results) => {
});
});
});

});
});
});
}
AsyncStorage.getItem (& # 39; Times & # 39 ;, err, results) => {
this.setState ({timeList: results})
}). then (() => {
if (this.state.counter < 4){
            this.setState({counter : this.state.counter + 1});
            this._onRefresh();
        }
        else{
            this.setState({counter : 0});
            this.setState({refreshing: false});
        }
    });

}

componentWillUnmount() {
    this.reRenderSomething;
}


componentDidMount(){
    AsyncStorage.getItem('UserId', (err, results) => {
this.setState ({id: results});
});
AsyncStorage.getItem ("nearest year", (err, nuo) => {
this.setState ({mostDate: nuo});
});
AsyncStorage.getItem (Doctor DoctorProfession #, (err, results) => {
this.setState ({doctorProfession: results});
});
function dates (current) {
var week = new Array ();
// from Monday, not Sunday
current.setDate ((current.getDate () - current.getDay () +1));
for (var i = 0; i < 7; i++) {
            week.push(
                new Date(current)
            );
            current.setDate(current.getDate() +1);
        }
        return week;
    }
    AsyncStorage.getItem('doctorName', (err, results) => {
this.setState ({doctorName: results});
});
AsyncStorage.getItem (& # 39; DV_ID & # 39 ;, err, results) => {
this.setState ({dv_id: results});
});
AsyncStorage.getItem (& # 39; UserId & # 39 ;, err, asm_id) => {
var soap = require (& # 39; soap-everywhere & # 39;);
let dvId = parseInt (JSON.parse (this.state.dv_id));
let asmId = parseInt (JSON.parse (asm_id));
var url = & # 39; xxx & # 39 ;;
var today = new Date (parseInt (this.state.closestDate.slice (1,5)), parseInt (this.state.closestDate.slice (6,8) -1), parseInt (this.state.closestDate.slice ( 9.11)));
var a = dates (new Date (today.getFullYear (), today.getMonth (), today.getDate () + this.state.day));
let data = JSON.stringify (a[0])
leave dataIki = JSON.stringify (a[6])
var args = {code: xxxx, asm_id: asmId, data: data.slice (1,11), dataIki: dataIki.slice (1,11), kodai: dvId};
soap.createClient (url, function (err, client) {
client.mGetLaisviLaikai (arguments, function (err, result) {
AsyncStorage.setItem (& # 39; Times & # 39 ;, JSON.stringify (result.mGetLaisviLaikaiResult[0].diffgram.NewDataSet.Gydytojai), () => {
AsyncStorage.mergeItem (& # 39; Times & # 39 ;, JSON.stringify (result.mGetLaisviLaikaiResult[0].diffgram.NewDataSet.Gydytojai), () => {
AsyncStorage.getItem (& # 39; Times & # 39 ;, err, results) => {

});
});
});

});
});
});
AsyncStorage.getItem (& # 39; Times & # 39 ;, err, results) => {
this.setState ({timeList: results});
});
this.subs = [
        this.props.navigation.addListener('didFocus', (payload) => this._onRefresh(payload)),
    ];
}
componentWillUnmount () {
this.subs.forEach (sub => sub.remove ());
this.setState ({isCancelled: true})
}
update = () => {
AsyncStorage.getItem (& # 39; Times & # 39 ;, err, results) => {
this.setState ({timeList: results});
}). then (() => {this._onRefresh ();});
}
onClick = () => {
this.props.navigation.navigate (& # 39; RegisterAppointmentsDate & # 39;)
}
confirm3 = (date, room, name, profession, time, dg_id, dg_nuo) => {
AsyncStorage.setItem (Doctor DoctorName #, JSON.stringify (name), () => {
AsyncStorage.mergeItem (& # 39; DoctorName & # 39; JSON.stringify (name), () => {
AsyncStorage.getItem ('DoctorName', (err, results) => {

});
});
});
AsyncStorage.setItem (Doctor DoctorProfession #, JSON.stringify (profession), () => {
AsyncStorage.mergeItem (Doctor DoctorProfession #, JSON.stringify (profession), () => {
AsyncStorage.getItem (Doctor DoctorProfession #, (err, results) => {

});
});
});
AsyncStorage.setItem (& # 39; DoctorDate & # 39; JSON.stringify (date), () => {
AsyncStorage.mergeItem (& # 39; DoctorDate & # 39; JSON.stringify (date), () => {
AsyncStorage.getItem ('DoctorDate', (err, results) => {

});
});
});
AsyncStorage.setItem (Doctor DoctorTime #, JSON.stringify (time), () => {
AsyncStorage.mergeItem (& # 39; DoctorTime & # 39 ;, JSON.stringify (time), () => {
AsyncStorage.getItem (& # 39; DoctorTime & # 39 ;, err, results) => {

});
});
});
AsyncStorage.setItem (& # 39; DoctorDgId & # 39; JSON.stringify (dg_id), () => {
AsyncStorage.mergeItem (& # 39; DoctorDgId & # 39; JSON.stringify (dg_id), () => {
AsyncStorage.getItem (& # 39; DoctorDgId & # 39 ;, err, results) => {

});
});
});
AsyncStorage.setItem (Doctor DoctorDgNuo #, JSON.stringify (dg_nuo), () => {
AsyncStorage.mergeItem (Doctor DoctorDgNuo #, JSON.stringify (dg_nuo), () => {
AsyncStorage.getItem ('DoctorDgNuo', (err, results) => {

});
});
});
AsyncStorage.setItem (Doctor DoctorRoom #, JSON.stringify (room), () => {
AsyncStorage.mergeItem (Doctor DoctorRoom #, JSON.stringify (room), () => {
AsyncStorage.getItem ('DoctorRoom', (err, results) => {

});
});
}). then (() => {this.props.navigation.navigate (& # 39; RegisterAppointmentConfirm & # 39;)
});

}
confirm = (date, room, name, profession, time, dg_id, dg_nuo, DGBUS_SUTR, pas_lygis) => {
if (DGBUS_SUTR === M #);
Alert.alert (
& # 39; & # 39 ;, Sveiki
& # 39; Jus registruojatės į mokamą vizitą! & # 39;
        [
            {text: 'Supratau', onPress: () => {this.confirm2(date, room, name, profession, time, dg_id, dg_nuo, pas_lygis);
                AsyncStorage.setItem('AppointmentMessage', 'Jus registruojatės į mokamą vizitą.', () => {
                    AsyncStorage.mergeItem('AppointmentMessage', 'Jus registruojatės į mokamą vizitą.', () => {
                        AsyncStorage.getItem('AppointmentMessage', (err, results) => {
                        });
                    });
                });
            }},
            {text: 'Grįžti', onPress: () => console.log('Grįžti')},
        ],
{cancelable: false}
)
}other{
this.confirm2 (date, room, name, profession, time, dg_id, dg_nuo, pas_lygis);
AsyncStorage.setItem (& # 39; AppointmentMessage & # 39 ;, ##; () => {
AsyncStorage.mergeItem (& # 39; AppointmentMessage & # 39 ;, ##; () => {
AsyncStorage.getItem (& # 39; AppointmentMessage & # 39 ;, err, results) => {
});
});
});
}
}
confirm2 = (date, room, name, profession, time, dg_id, dg_nuo, pas_lygis) => {
if (pas_lygis ===> 2 & # 39;) {
Alert.alert (
& # 39; & # 39 ;, Sveiki
& # 39; Jūsų pasirinktam vizitui, a member of the private community, responsible for relations with other citizens. Neturint siuntimo jums bus suteikta mokama konsultacija. & # 39 ;,
        [
            {text: 'Supratau', onPress: () => {this.confirm3(date, room, name, profession, time, dg_id, dg_nuo); AsyncStorage.setItem('AppointmentMessage', 'Jūsų pasirinktam vizitui, privalote turėti šeimos gydytojo siuntimą. Neturint siuntimo jums bus suteikta mokama konsultacija.', () => {
                AsyncStorage.mergeItem('AppointmentMessage', 'Jūsų pasirinktam vizitui, privalote turėti šeimos gydytojo siuntimą. Neturint siuntimo jums bus suteikta mokama konsultacija.', () => {
                    AsyncStorage.getItem('AppointmentMessage', (err, results) => {
                    });
                });
            });
            }},
            {text: 'Grįžti', onPress: () => console.log('Grįžti')},
        ],
{cancelable: false}
)
}other{
this.confirm3 (date, room, name, profession, time, dg_id, dg_nuo);
AsyncStorage.setItem (& # 39; AppointmentMessage & # 39 ;, ##; () => {
AsyncStorage.mergeItem (& # 39; AppointmentMessage & # 39 ;, ##; () => {
AsyncStorage.getItem (& # 39; AppointmentMessage & # 39 ;, err, results) => {
});
});
});
}
}
render () {
let api = JSON.parse (this.state.timeList)

if (! this.state.timeList && this.state.closestDate) {
function dates (current) {
var week = new Array ();
// from Monday, not Sunday
current.setDate ((current.getDate () - current.getDay () +1));
for (var i = 0; i <7; i ++) {
week.push (
new date (current)
)
current.setDate (current.getDate () +1);
}
return week
}
let's closest Year = parseInt (this.state.closestDate.slice (1,5));
let mostMonth = parseInt (this.state.closestDate.slice (6,8)) - 1;
let nearest day = parseInt (this.state.closestDate.slice (9,11)) + 1;
var today = new Date (the nearest year, the nearest month, the closest day);
var a = dates (new Date (today.getFullYear (), today.getMonth (), today.getDate () + this.state.day));
leave diena0 = JSON.stringify (one[0])
let diena1 = JSON.stringify (one[1])
let diena2 = JSON.stringify (a[2])
let diena3 = JSON.stringify (a[3])
let diena4 = JSON.stringify (a[4])
leave diena5 = JSON.stringify (one[5])
let diena6 = JSON.stringify (a[6])
be mounthNr = diena0.slice (7,8)
if (diena1.slice (6,8) <10) {
mounthNr = diena0.slice (7,8)
}other{
mounthNr = diena0.slice (6.8)
}

month const = [ 'Tuščias', 'Sausis', 'Vasaris', 'Kovas', 'Balandis', 'Gegužė', 'Biržėlis', 'Liepa', 'Rugpjutis', 'Rugsėjis', 'Spalis', 'Lapkritis', 'Gruodis']
    return(                
    
                    <ScrollView
refreshControl = {
                                
                            }
>
        
        
        
        
            2
        
        
        
        Laiko pasirinkimas
        
        
            Gyd. {JSON.parse (this.state.doctorName)}
        
        
            {! this.state.isCancelled && this.setState ({day: this.state.day - 7}); this._onRefresh ();}}>
        
        
        {month[mounthNr]} {diena0.slice (9,11)} - {diena6.slice (9,11)} / {diena0.slice (1,5)}
            {! this.state.isCancelled && this.setState ({day: this.state.day + 7}); this._onRefresh ();}}>
        
        
        
        
    
    
    
    
    )
}
else if (this.state.timeList && this.state.closestDate) {
function dates (current) {
var week = new Array ();
// from Monday, not Sunday
current.setDate ((current.getDate () - current.getDay () +1));
for (var i = 0; i <7; i ++) {
week.push (
new date (current)
)
current.setDate (current.getDate () +1);
}
return week
}
let nearest year = parseInt (this.state.closestDate.slice (1,5));
let mostMonth = parseInt (this.state.closestDate.slice (6,8) -1);
let nearest day = parseInt (this.state.closestDate.slice (9,11)) + 1;
var today = new Date (the nearest year, the nearest month, the closest day);
var a = dates (new Date (today.getFullYear (), today.getMonth (), today.getDate () + this.state.day));
leave diena0 = JSON.stringify (one[0])
let diena1 = JSON.stringify (one[1])
let diena2 = JSON.stringify (a[2])
let diena3 = JSON.stringify (a[3])
let diena4 = JSON.stringify (a[4])
leave diena5 = JSON.stringify (one[5])
let diena6 = JSON.stringify (a[6])
be mounthNr = diena0.slice (7,8)
if (diena1.slice (6,8) <10) {
mounthNr = diena0.slice (7,8)
}other{
mounthNr = diena0.slice (6.8)
}

month const = [ 'Tuščias', 'Sausis', 'Vasaris', 'Kovas', 'Balandis', 'Gegužė', 'Biržėlis', 'Liepa', 'Rugpjutis', 'Rugsėjis', 'Spalis', 'Lapkritis', 'Gruodis']
    if (! api.gyd_asmuo) {
api = JSON.parse (this.state.timeList)
}other{
api = [JSON.parse(this.state.timeList)]
    }
return (
        
            <ScrollView
refreshControl = {
                                
                            }
>
        
        
        
        
            2
        
        
        
        Laiko pasirinkimas
        
        
            Gyd. {JSON.parse (this.state.doctorName)}
        
        
            {! this.state.isCancelled && this.setState ({day: this.state.day - 7}); this._onRefresh ();}}>
        
        
        {month[mounthNr]} {diena0.slice (9,11)} - {diena6.slice (9,11)} / {diena0.slice (1,5)}
            {! this.state.isCancelled && this.setState ({day: this.state.day + 7}); this._onRefresh ();}}>
        
        
        
        
        
            Sekmadienis
            {diena0.slice (6,8)} / {diena0.slice (9,11)}
        
        
        
        
        {api.map ((v, index) => {
leave apiO = v
if (diena0.slice (9,11) === apiO.dg_nuo.slice (8,10)) {

return(
                    
                        this.confirm (diena0.slice (1,11), apiO.kab_nr, apiO.gyd_asmuo, apiO.pas_profilis, apiO.time, apiO.dg_id, apiO.dg_nuo, apiO.DGBUS_SUTR, apiO.pas_ly).
                        
                            Mokamas
                            {diena0.slice (1,11)} {apiO.time}
                            Mokamas
                        
                    
                    
                    
                    
                    
                    )
}
})}
        
            Pirmadienis
            {diena1.slice (6,8)} / {diena1.slice (9,11)}
        
        
        
        
        {api.map ((v, index) => {
leave apiO = v
if (diena1.slice (9,11) === apiO.dg_nuo.slice (8,10)) {

return(
                    
                        this.confirm (diena1.slice (1,11), apiO.kab_nr, apiO.gyd_asmuo, apiO.pas_profilis, apiO.time, apiO.dg_id, apiO.dg_nuo, apiO.DGBUS_SUTR, apiO.pas_ly).
                        
                            Mokamas
                            {diena1.slice (1,11)} {apiO.time}
                            Reikia siuntimo
                        
                    
                    
                    
                    
                    
                    )
}
})}
        
            Antradienis
            {diena2.slice (6,8)} / {diena2.slice (9,11)}
        
        
        
        
        {api.map ((v, index) => {
leave apiO = v
if (diena2.slice (9,11) === apiO.dg_nuo.slice (8,10)) {

return(
                    
                        this.confirm (diena2.slice (1,11), apiO.kab_nr, apiO.gyd_asmuo, apiO.pas_profilis, apiO.time, apiO.dg_id, apiO.dg_nuo, apiO.DGBUS_SUTR, apiO.pas_ly).
                        
                            Mokamas
                            {diena2.slice (1,11)} {apiO.time}
                            Reikia siuntimo
                        
                    
                    
                    
                    
                    
                    )
}
})}
        
            Trečiadienis
            {diena3.slice (6,8)} / {diena3.slice (9,11)}
        
        
        
        
        {api.map ((v, index) => {
leave apiO = v
if (diena3.slice (9,11) === apiO.dg_nuo.slice (8,10)) {

return(
                    
                        this.confirm (diena3.slice (1,11), apiO.kab_nr, apiO.gyd_asmuo, apiO.pas_profilis, apiO.time, apiO.dg_id, apiO.dg_nuo, apiO.DGBUS_SUTR, apiO.pas_ly).
                        
                            Mokamas
                            {diena3.slice (1,11)} {apiO.time}
                            Reikia siuntimo
                        
                    
                    
                    
                    
                    
                    )
}
})}
        
            Ketvirtadienis
            {diena4.slice (6,8)} / {diena4.slice (9,11)}
        
        
        
        
        {api.map ((v, index) => {
leave apiO = v
if (diena4.slice (9,11) === apiO.dg_nuo.slice (8,10)) {

return(
                    
                        this.confirm (diena4.slice (1,11), apiO.kab_nr, apiO.gyd_asmuo, apiO.pas_profilis, apiO.time, apiO.dg_id, apiO.dg_nuo, apiO.DGBUS_SUTR, apiO.pas_ly).
                        
                            Mokamas
                            {diena4.slice (1,11)} {apiO.time}
                            Reikia siuntimo
                        
                    
                    
                    
                    
                    
                    )
}
})}
        
            Penktadienis
            {diena5.slice (6,8)} / {diena5.slice (9,11)}
        
        
        
        
        {api.map ((v, index) => {
leave apiO = v
if (diena5.slice (9,11) === apiO.dg_nuo.slice (8,10)) {

return(
                    
                        this.confirm (diena5.slice (1,11), apiO.kab_nr, apiO.gyd_asmuo, apiO.pas_profilis, apiO.time, apiO.dg_id, apiO.dg_nuo, apiO.DGBUS_SUTR, apiO.pas_ly).
                        
                            Mokamas
                            {diena5.slice (1,11)} {apiO.time}
                            Reikia siuntimo

                        
                    
                    
                    
                    
                    
                    )
}
})}
        
            Šeštadeinis
            {diena6.slice (6,8)} / {diena6.slice (9,11)}
        
        
        
        
        {api.map ((v, index) => {
leave apiO = v
if (diena6.slice (9,11) === apiO.dg_nuo.slice (8,10)) {

return(
                    
                        this.confirm (diena6.slice (1,11), apiO.kab_nr, apiO.gyd_asmuo, apiO.pas_profilis, apiO.time, apiO.dg_id, apiO.dg_nuo, apiO.DGBUS_SUTR, apiO.pas_ly).
                        
                            Mokamas
                            {diena6.slice (1,11)} {apiO.time}
                            Reikia siuntimo
                        
                    
                    
                    
                    
                    
                    )
}
})}
                
            
        

  

  

  

  )
}other{
return(
    
                        <ScrollView
refreshControl = {
                                
                            }
>
Kraunasi
            
    
  
  
  
  )
}
}
}

export default RegisterAppointmentsDate;