Отрисовано больше хуков, чем во время предыдущей ошибки рендеринга, когда начальное значение для хука является результатом запроса из базы данных.

Я использую ловушку React и хочу иметь значение, которое извлекается из базы данных в качестве начального значения. Однако я получаю следующую ошибку:

Нарушение инварианта: Нарушение инварианта: обработано больше хуков, чем во время предыдущего рендеринга.

const { data, loading, error } = useQuery(GET_DATA)
const { initialValue } = data
const [value, setValue] = useState(initialValue)

Я использую хук React Apollo.

Обновить

export default NotificationScreen = ({ navigation }) => {
    const { data: initialNotificationSettings, loading: loadingInitialSettings, error: initialSettingsError } = useQuery(GET_NOTIFICATION_SETTINGS)
    if (loadingInitialSettings) {
        return (
            <View style={[styles.container, styles.horizontal]}>
                <ActivityIndicator size="large" color="#FF5D4E" />
            </View>
        )
    }
    if (initialSettingsError) return <Text>Error...</Text>

    const {
        borrowerLendingNotificationToken,
    } = initialNotificationSettings.me
    const [borrowerPending, notifyBorrowerPending] = useState(borrowerLendingNotificationToken)

    return (
        <SafeAreaView style={styles.container}>
        </SafeAreaView>
    )
}

react-native reactjs react-hooks react-apollo
person Kevvv    schedule 14.12.2019    source источник
comment
Не могли бы вы поделиться полным кодом вашего компонента?   -  person Tuan Luong    schedule 15.12.2019
comment
@TuanLuong Я включил полный код   -  person Kevvv    schedule 15.12.2019

Ответы (1)


arrow_upward
19
arrow_downward

Проблема в том, что вы используете крючок ниже return. Попробуй обновить

export default NotificationScreen = ({ navigation }) => {
    const { data: initialNotificationSettings, loading: loadingInitialSettings, error: initialSettingsError } = useQuery(GET_NOTIFICATION_SETTINGS)

    const [borrowerPending, notifyBorrowerPending] = useState("")

    useEffect(() => {
        if (initialNotificationSettings.me) {
            const { borrowerLendingNotificationToken } = initialNotificationSettings.me
            notifyBorrowerPending(borrowerLendingNotificationToken);
        }
    }, [initialNotificationSettings]);

    if (loadingInitialSettings) {
        return (
            <View style={[styles.container, styles.horizontal]}>
                <ActivityIndicator size="large" color="#FF5D4E" />
            </View>
        )
    }
    if (initialSettingsError) return <Text>Error...</Text>

    return (
        <SafeAreaView style={styles.container}>
        </SafeAreaView>
    )
}
person Tuan Luong    schedule 15.12.2019
comment
Ваш заемщикPending не отображается, если для loadInitialSettings или initialSettingsError установлено значение true. Все хуки внутри компонента должны быть одинаковыми при каждом рендеринге. - person Tuan Luong; 15.12.2019
comment
ты сделал мой день, спасибо! - person Sultan Ali; 17.03.2021
comment
Подарок, который продолжает дарить .. Спасибо за этот ответ !! - person Sergnio; 17.03.2021