React native: ActivityIndicator未按预期工作;它一直在显示

Question

我应该只看到ActivityIndicator当我点击离子图标时，它是白色的，但ActivityIndicator永远不会停止工作。

当getSamplesToChoose函数完成它的动作时，它应该停止。

函数getSamplesToChoose

function getSamplesToChoose() {
const fromDate = params.fromDate;
const toDate = params.toDate;
console.log('getSamplesToChoose for ws:', selectedWaterSource);
if (selectedWaterSource.length === 0) {
Toast.show({ text1: 'no choose points' });
return;
}
(async () => {
const wsRequestCount = await wsSampleRequestBySource(
// check webservice
selectedWaterSource,
fromDate,
toDate
);
if (wsRequestCount === 0) {
//no requests from server
Toast.show({
text1: 'no drishot:' + fromDate + ' lebein:' + toDate,
text2: selectedWaterSource + ' points: ',
});
}
// updated db
const requestList = await getRequestBySourceAndDates(
selectedWaterSource,
fromDate,
toDate
);
if (requestList.length > 0) {
// there are requests. move to next screen with list
navigation.navigate('list of drishot', {
paramsFromNekudotDigum: {
requestList,
fromDate: date1.toISOString().slice(0, 10),
toDate: date2.toISOString().slice(0, 10),
},
});
}
toggleLoading(false);
})();
}

import {ActivityIndicator} from 'react-native';
export default function tomato() {
const [isLoading, toggleLoading] = useState(false);
return (
<TouchableOpacity
activeOpacity={1}
onPress={!isLoading ? () => {
toggleLoading(true);
getSamplesToChoose();
} : null}
>
<View>
<NavigationDialog />
</View>
{
isLoading ?
<View style={styles.indicator}>
<ActivityIndicator size="large" color="#4abdff" />
</View>
:
<Ionicon
style={{ bottom: -10 }}
name="md-checkmark-circle-outline"
size={30}
color={
Array.isArray(selectedWaterSource) === true &&
selectedWaterSource.length > 0
? 'white'
: 'gray'}
/>
}
</TouchableOpacity>
);
}

Answer 1

好吧，我认为你的函数有一些漏洞，这意味着有一种可能性，它可以运行，而不是到达底部，你关闭活动指示器，所以试试这个代码:

function getSamplesToChoose() {
const fromDate = params.fromDate;
const toDate = params.toDate;
console.log('getSamplesToChoose for ws:', selectedWaterSource);
if (selectedWaterSource.length === 0) {
Toast.show({ text1: 'no choose points' });
toggleLoading(false)
return;
}
(async () => {
const wsRequestCount = await wsSampleRequestBySource(
// check webservice
selectedWaterSource,
fromDate,
toDate
);
if (wsRequestCount === 0) {
//no requests from server
Toast.show({
text1: 'no drishot:' + fromDate + ' lebein:' + toDate,
text2: selectedWaterSource + ' points: ',
});
toggleLoading(false)
}
//updated db
const requestList = await getRequestBySourceAndDates(
selectedWaterSource,
fromDate,
toDate
);
if (requestList.length > 0) {
// there are requests. move to next screen with list 
toggleLoading(false) //first turn off the Activity Indicator
navigation.navigate('list of drishot', {
paramsFromNekudotDigum: {
requestList,
fromDate: date1.toISOString().slice(0, 10),
toDate: date2.toISOString().slice(0, 10),
},
});
}
toggleLoading(false);
})();
}