概要
初回起動時かどうか判定する方法
1️⃣AsyncStorageをインストール
npm install @react-native-async-storage/async-storage
2️⃣初回起動時かどうか判定する
「初回起動時に開くページ」にコピペするだけでOK!
import React, { useEffect, useState } from 'react';
import { View, Text } from 'react-native';
import AsyncStorage from '@react-native-async-storage/async-storage';
const App: React.FC = () => {
const [isFirstLaunch, setIsFirstLaunch] = useState<boolean | null>(null);
useEffect(() => {
const checkFirstLaunch = async () => {
try {
const value = await AsyncStorage.getItem('hasLaunched');
if (value === null) {
// ✅ここに初回起動時の処理を書く
// ...
setIsFirstLaunch(true);
await AsyncStorage.setItem('hasLaunched', 'true');
} else {
setIsFirstLaunch(false);
}
} catch (error) {
console.error('Error checking app launch status: ', error);
}
};
checkFirstLaunch();
}, []);
// フラグ読み込み中は何も表示しない
if (isFirstLaunch === null) {
return null;
}
return (
<View>
{isFirstLaunch ? (
<Text>初回起動です!</Text>
) : (
<Text>2回目以降の起動です!</Text>
)}
</View>
);
};
export default App;