【useState】expoのNotificationをstateで設定しています。

Question

Expoで通知アプリを作っています。
triggerで毎週9時3分に通知をする設定で、曜日を数字で指定できるようにしたいので、曜日の欄にstateを挿入して、textInputを書いたのですが、以下のエラーが発生しました。

実現したいこと

triggerの曜日にstateを挿入して、textInputで書かれた数字に対応させたいです。
初心者で申し訳ないですが、ご教示いただけますと幸いです！よろしくお願いします！

以下、HomeScreen全文です。

import { StatusBar } from 'expo-status-bar';
import React from 'react';
import GomiList from "../components/GomiList";
import { Text, View, StyleSheet, TextInput } from 'react-native';

import * as Notifications from 'expo-notifications';

Notifications.setNotificationHandler({
  handleNotification: async () => ({
    shouldShowAlert: true,
    shouldPlaySound: false,
    shouldSetBadge: false,
  }),
});

const content = {
  title: 'ゴミ出しの時間です！',
}

const trigger = () => {
  return (
    repeats : true,
    hour: 8,
    minute: 15,
    weekday: {number},
  )}

Notifications.scheduleNotificationAsync({
  content: content,
  trigger: trigger,
});

export default function HomeScreen() {
  return (
    <View style={styles.container}>
        <View style={styles.GomiList}>
          <GomiList title="燃えるごみ"/>
        </View>
        <View style={styles.GomiList}>
          <GomiList title="燃えないごみ"/>
        </View>
        <View>
          <TextInput onChangeText={newNumber => setNumber(newNumber)} />
          <Text>{number}</Text>
        </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
  },
  GomiList: {
    paddingTop: 20,
    alignItems: 'center',
  },
});

Answer 1

const trigger = () => {
  return (
    repeats : true,
    hour: 8,
    minute: 15,
    weekday: {number},
  )
}

上記の{number}が誤っているのだと思います。
そもそもtriggerの引数に曜日に該当するnumberがないですし(推測ですがsetNumber()で変更した値を渡すのだと思いますが・・・)、
渡すとしても数値型なので

const trigger = () => {
  return (
    repeats : true,
    hour: 8,
    minute: 15,
    //weekday: {number},
    weekday : number,
  )
}

が正しいかと思います。

Comments

[ok09]

nekonikiさん
いつもありがとうございます。

お伝えいただいたように修正をして、
書き忘れを複数発見したのでそれらも修正したのですが、Hooksのエラーが起こってしまいました。
・Hooksのエラー
https://reactjs.org/docs/error-decoder.html/?invariant=321

原因が何かわかりますか？

＊＊コード＊＊
import { StatusBar } from 'expo-status-bar';
import React, { useState } from 'react';
import GomiList from "../components/GomiList";
import { Text, View, StyleSheet, TextInput } from 'react-native';

import * as Notifications from 'expo-notifications';

Notifications.setNotificationHandler({
handleNotification: async () => ({
shouldShowAlert: true,
shouldPlaySound: false,
shouldSetBadge: false,
}),
});

const [number, setNumber] = useState();

const content = {
title: 'ゴミ出しの時間です！',
}

const trigger = {
repeats : true,
hour: 8,
minute: 15,
weekday: number,
}

Notifications.scheduleNotificationAsync({
content: content,
trigger: trigger,
});

export default function HomeScreen() {
return (
<View style={styles.container}>
<View style={styles.GomiList}>
<GomiList title="燃えるごみ"/>
</View>
<View style={styles.GomiList}>
<GomiList title="燃えないごみ"/>
</View>
<View>
<TextInput onChangeText={newNumber => setNumber(newNumber)} />
<Text>number</Text>
</View>
</View>
);
}

[nekoniki]

返信が遅れすいません。
既に別質問を立てており、その中で回答が出ていますが、
useStateを使う位置がコンポーネントの外になっているためです。