WedX - журнал о программировании и компьютерных науках

Мне нужно исправить ошибку с реактивным родным. в чем проблема?

Ошибка: неверный вызов ловушки. Хуки могут быть вызваны только внутри тела функционального компонента. Это могло произойти по одной из следующих причин:

  1. У вас могут быть несовместимые версии React и средства визуализации (например, React DOM)
  2. Возможно, вы нарушаете правила крючков
  3. У вас может быть несколько копий React в одном приложении.

   

     import React, { PureComponent, useState } from 'react'
        import { StoryContainer } from 'react-native-stories-view'
        import {
            TouchableOpacity,
            Alert,
            StyleSheet,
            View,
            Text,
            SafeAreaView,
            ImageBackground,
            Image,
            Platform,
            StatusBar,
        } from 'react-native'
        
        import { connect } from 'react-redux'
        
        class StoryViewScreen extends PureComponent {
            constructor(props) {
                super(props);
                this.state = {
        
                }
            }
        
            render() {
                const { files } = this.props.route.params;
                const fileUrls = [];
                for (var i = 0; i < files.length; i++) {
                    fileUrls.push(files[i].uri);
                }
                console.log("files path:", fileUrls);
                return (
                    <View style={{ flex: 1, flexDirection: 'column' }}>
                        {Platform.OS === 'ios' && (
                            <View style={{
                                backgroundColor: 'gray',
                                height: 45,
                            }}>
                                <StatusBar barStyle="light-content" backgroundColor={'green'} />
                            </View>
                        )}
                        {Platform.OS === 'android' && (
                            <StatusBar barStyle="dark-content" backgroundColor={'white'} />
                        )}
        
                        <SafeAreaView style={{ flex: 1, flexDirection: 'column', backgroundColor: 'gray' }}>
                            <StoryContainer
                                visible={true}
                                enableProgress={false}
                                images={fileUrls}
                                duration={5}
                                containerStyle={{
                                    width: '100%',
                                    height: '100%',
                                }} />
                            {/* <Text>This is teh realdksfjdsklfj</Text> */}
                        </SafeAreaView>
                    </View>
                );
            }
        };
        
        const style = StyleSheet.create({
        
        });
        
        function mapStateToProps(state) {
            return {
                // currentUser: state.user.currentUser,
            };
        }
        
        function mapDispatchToProps(dispatch) {
            return {
                dispatch
            };
        }
        
        export default connect(mapStateToProps, mapDispatchToProps)(StoryViewScreen);

20.05.2021

  • Если я добавлю ‹StoryContainer›, произойдет ошибка. 20.05.2021

Ответы:


1

Вы не можете использовать useState в компоненте класса, вместо этого используйте setState для установки состояния.

20.05.2021
  • Мне нужно использовать setState? 20.05.2021
  • Да, this.setState, чтобы установить состояние, в котором вы используете useState в компоненте класса 20.05.2021
  • Я не использовал useState в этом компоненте класса. 20.05.2021
  • Для просмотра истории я использовал модуль узла response-native-story-views и следовал образцу кода, как я упоминал выше, но произошла ошибка 20.05.2021
  • Но в вашем коде я вижу импорт useState 20.05.2021
  • Если у вас был опыт работы с этим модулем, расскажите, пожалуйста, как им пользоваться. 20.05.2021
  • да .. но я не использовал это 20.05.2021
  • Какую версию react / react native вы используете? 20.05.2021
  • Опорный крюк 16,13 / 0,64 20.05.2021
  • не волнуйтесь, поддержка крючка 20.05.2021
  • react-native-stories-view использует другую версию: "react": "16.11.0", "react-native": "0.62.1" это вызывает проблему. 20.05.2021
  • У вас могут быть несовместимые версии React и React DOM. 20.05.2021
  • Новые материалы

    Как создать диаграмму градиентной кисти с помощью D3.js
    Резюме: Из этого туториала Вы узнаете, как добавить градиентную кисть к диаграмме с областями в D3.js. Мы добавим градиент к значениям SVG и применим градиент в качестве заливки к диаграмме с..

    Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что это выглядит сложно…
    Просто начните и учитесь самостоятельно Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что он кажется мне сложным, и я бросил его. Это в основном инструмент..

    Лицензии с открытым исходным кодом: руководство для разработчиков и создателей
    В динамичном мире разработки программного обеспечения открытый исходный код стал мощной парадигмой, способствующей сотрудничеству, инновациям и прогрессу, движимому сообществом. В основе..

    Объяснение документов 02: BERT
    BERT представил двухступенчатую структуру обучения: предварительное обучение и тонкая настройка. Во время предварительного обучения модель обучается на неразмеченных данных с помощью..

    Как проанализировать работу вашего классификатора?
    Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..

    Работа с цепями Маркова, часть 4 (Машинное обучение)
    Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..

    Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
    Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..


    Для любых предложений по сайту: [email protected]