現在、コードを実行すると、アプリが開かれるたびにモーダルが表示されます。これは、「modalVisibility」の初期状態に関係していると思います
「const [modalVisibility, setModalVisibility] = useState(true);」アプリケーションが起動されるたびに呼び出されますか? だとしたらそれはそれで問題です。
これは "onShow" モーダル プロパティの問題ですか?
import React, { useState, useEffect } from 'react';
import { StatusBar, StyleSheet, View, Modal, Text, Button, ScrollView, AsyncStorage } from 'react-native';
export default App = (props) => {
const [modalVisibility, setModalVisibility] = useState(true);
const checkIfNeedOpenModal = async () => {
try {
const isFirstOpen = await AsyncStorage.getItem('modal');
if (!isFirstOpen || isFirstOpen !== 'true') {
setModalVisibility(true);
}
} catch (error) {
alert(error);
}
}
const saveModalOpen = async () => {
try {
await AsyncStorage.setItem('modal', 'true');
} catch (error) {
alert(error);
}
}
const onModalShow = () => {
saveModalOpen();
}
useEffect(() => {
checkIfNeedOpenModal();
});
return (
<View style={styles.container}>
<Modal
animationType='slide'
onShow={saveModalOpen}
transparent={true}
visible={modalVisibility}
onRequestClose={() => {
alert('closed');
}}
>
<View style={styles.modal}>
<ScrollView style={[styles.scrollview, { flex: 1 }]}>
<Text>placeholder text</Text>
</ScrollView>
<View style={{ flexDirection: 'row', justifyContent: 'space-evenly' }}>
<Button
title="deny"
onPress={() => alert('you must accept the privacy policy to play')}
/>
<Button
title="accept"
onPress={() => setModalVisibility(false)}
/>
</View>
</View>
</Modal>
</View>
);
};