I've just started learning react native for about a month and only focus on the class but my push notifications (expo docs) I find are written with react hooks, I have some access issues on the side class but I don't know anything about hooks .... please help me switch my class. Thanks everyone.I tried switching to class but got a lot of errors https://docs.expo.io/push-notifications/overview/
1 Answer
For exp push notification (class type component) , please use the following :
import React, {Component} from 'react';
//import { Notifications } from 'expo';
import * as Notifications from 'expo-notifications';
import * as Permissions from 'expo-permissions';
import Constants from 'expo-constants';
import {
Alert,
Vibration, Platform,
Image,
StyleSheet,
View,
AsyncStorage,
TextInput,
Text,
TouchableOpacity,
} from 'react-native';
Notifications.setNotificationHandler({
handleNotification: async () => ({
shouldShowAlert: true,
shouldPlaySound: false,
shouldSetBadge: false,
}),
});
export default class xxxxxx extends Component {
state = {
expoPushToken: '',
notification: {},
};
registerForPushNotificationsAsync = async () => {
let token;
if (Constants.isDevice) {
const { status: existingStatus } = await Permissions.getAsync(Permissions.NOTIFICATIONS);
let finalStatus = existingStatus;
if (existingStatus !== 'granted') {
const { status } = await Permissions.askAsync(Permissions.NOTIFICATIONS);
finalStatus = status;
}
if (finalStatus !== 'granted') {
alert('Failed to get push token for push notification!');
return;
}
token = (await Notifications.getExpoPushTokenAsync()).data;
//this.setState({
// xbuttonstate: false
// })
this.setState({expoPushToken:token})
// alert(this.state.expoPushToken);
// unremark the above if you want to see the expoPushToken
} else {
alert('Must use physical device for Push Notifications');
}
if (Platform.OS === 'android') {
Notifications.setNotificationChannelAsync('default', {
name: 'default',
importance: Notifications.AndroidImportance.MAX,
vibrationPattern: [0, 250, 250, 250],
lightColor: '#FF231F7C',
});
}
};
/// Add other codes you want (e.g. render /view )
}
