質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
React Native

React Nativeは、ネイティブモバイルアプリ(iOS/Android)を作成できるJavaScriptフレームワークです。Reactと同じ設計のため、宣言的なコンポーネントでリッチなUIを開発することが可能です。

Q&A

解決済

1回答

1083閲覧

React NativeでのNotificationについて。【Parsing error: Unexpected token】

ok09

総合スコア11

React Native

React Nativeは、ネイティブモバイルアプリ(iOS/Android)を作成できるJavaScriptフレームワークです。Reactと同じ設計のため、宣言的なコンポーネントでリッチなUIを開発することが可能です。

0グッド

0クリップ

投稿2020/07/08 02:34

前提・実現したいこと

React Native初心者で、簡単な通知アプリを作っています。
"sendPushNotification"の部分で以下のエラーが発生しています。
初歩的なミスだとは思うのですが、解決の方法がわからず、教えていただけるとうれしいです。

発生している問題・エラーメッセージ

Parsing error: Unexpected token, expected "("(Fatal)

該当のソースコード

Reactnative

1 2<途中から引用> 3export default class AppContainer extends React.Component { 4 componentDidMount() { 5 this.registerForPushNotificationsAsync(); 6 7 this.onReceivedListener = Notifications.addNotificationReceivedListener(this.onReceived); 8 this.onResponseReceivedListener = Notifications.addNotificationResponseReceivedListener( 9 this.onResponseReceived, 10 ); 11 } 12 13 componentWillUnmount() { 14 this.onReceivedListener.remove(); 15 this.onResponseReceivedListener.remove(); 16 } 17 18 onReceived = (notification) => { 19 console.log(notification); 20 this.setState('notification'); 21 }; 22 23 onResponseReceived = (response) => { 24 console.log(response); 25 }; 26 27 async function sendPushNotification(expoPushToken) { 28 const message = { 29 to: expoPushToken, 30 sound: 'default', 31 title: 'Original Title', 32 body: 'And here is the body!', 33 data: { data: 'goes here' }, 34 }; 35 36 await fetch('https://exp.host/--/api/v2/push/send', { 37 method: 'POST', 38 headers: { 39 Accept: 'application/json', 40 'Accept-encoding': 'gzip, deflate', 41 'Content-Type': 'application/json', 42 }, 43 body: JSON.stringify(message), 44 }); 45 }; 46 47 registerForPushNotificationsAsync = async () => { 48 if (Constants.isDevice) { 49 const { status: existingStatus } = await Permissions.getAsync(Permissions.NOTIFICATIONS); 50 let finalStatus = existingStatus; 51 if (existingStatus !== 'granted') { 52 const { status } = await Permissions.askAsync(Permissions.NOTIFICATIONS); 53 finalStatus = status; 54 } 55 56 if (finalStatus !== 'granted') { 57 alert('Failed to get push token for push notification!'); 58 return; 59 } 60 const { data: token } = await Notifications.getExpoPushTokenAsync(); 61 console.log(token); 62 this.setState({ expoPushToken: token }); 63 } else { 64 alert('Must use physical device for Push Notifications'); 65 } 66 67 if (Platform.OS === 'android') { 68 Notifications.setNotificationChannelAsync('default', { 69 name: 'default', 70 importance: Notifications.AndroidImportance.MAX, 71 vibrationPattern: [0, 250, 250, 250], 72 lightColor: '#FF231F7C', 73 }); 74 } 75 }; 76 77<以下、renderなど>

試したこと

初心者ですので、下手に変更などはできていませんが、
・{}()のミスの確認済み
・importする必要のある、expo-constants、expo-notifications、permissionsの確認済み

補足情報(FW/ツールのバージョンなど)

また、以下のExpoのドキュメントを参考にコードを書いています。
https://docs.expo.io/versions/latest/sdk/notifications/

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

class 内の記述で functionは不要なので、
function を削除すれば動きそうに思います。

async function sendPushNotification(expoPushToken) { ↓ async sendPushNotification(expoPushToken) {

参考までに サンプルです。

投稿2020/07/08 02:53

wilf

総合スコア300

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

ok09

2020/07/08 06:36

回答のように、functionを削除すると、別のエラーが発生しました。 わかる方、教えていただけるとうれしいです。 ”registerFor...と順番を入れ替えるように表示が出たので、順番を入れ替えると、以下のエラー表示が出ました。 Expected 'this' to be used by class async method 'sendPushNotification'. (class-method-use-this) https://eslint.org/docs/rules/class-methods-use-this <私の考え、と実行したこと> this,setState({ expoPushToken: token }); にも「Unused state field」というエラーが出ていたので、以下のように変更しました。 to: expoPushToken, ↓ to: this.state.expoPushToken, すると、今度は下記のような別のエラーが出ました。 Must use destructuring state assignment ( react/destructuring-assignment ) https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/destructuring-assignment.md
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問