я хочу использовать индикатор выполнения для загрузки данных в react native

#react-native #axios #progress-bar

#react-native #axios #индикатор выполнения

Вопрос:

Я хочу использовать индикатор выполнения для моей загрузки в react native, я не понимаю, как использовать функцию для создания индикатора выполнения. Я новичок в react native.

это код для выполнения загрузки

     console.log(progressEvent.loaded, progressEvent.total);
    console.log(
      'Upload progress: '  
        Math.round((progressEvent.loaded / progressEvent.total) * 100)  
        '%',
    );
  }; 
 

это моя функция загрузки с использованием axios

 axios({
          method: 'POST',
          url: url,
          data: data,
          headers: headers,
          onUploadProgress: uploadProgress,
        }) 
 

здесь я хочу показать свой индикатор выполнения

 <View style={styles.buttonStyle}>
            <Text style={styles.buttonTextStyle}>
              Progress={() => uploadProgress()}
            </Text>
          </View>
 

пожалуйста, помогите мне. Спасибо

Ответ №1:

Я решил это, мне нужно было использовать для этого метод useState.

 const [percentage, setPercentage] = useState(0);
 
 const uploadProgress = (progressEvent) => {
    var Percentage = Math.round(
      (progressEvent.loaded / progressEvent.total) * 100,
    );
    setPercentage(Percentage);
    console.log(progressEvent.loaded, progressEvent.total);
    console.log(
      'Upload progress: '  
        Math.round((progressEvent.loaded / progressEvent.total) * 100)  
        '%',
    );
  };
 
 <Progress.Bar progress={percentage} width={200} />