useSelector не может экспортировать из 'react-redux'

#reactjs #firebase #react-redux

Вопрос:

У меня ошибка, которая гласит Can't import 'UseSelector' from react-redux . Я создаю небольшой проект под названием Начало работы Для этого я использую firebase и react, вот файл кода, в котором возникла ошибка

 import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { createStore, applyMiddleware, compose } from 'redux';
import rootReducer from './store/reducers/rootReducer'
import { Provider } from 'react-redux'
import thunk from 'redux-thunk'
import {createFirestoreInstance, reduxFirestore, getFirestore } from 'redux-firestore'
import { ReactReduxFirebaseProvider, getFirebase, reactReduxFirebase } from 'react-redux-firebase';
import firebase from 'firebase/app'
import fbConfig from './config/fbConfig'
import { useSelector } from 'react-redux'
import { isLoaded } from 'react-redux-firebase';



`
const store = createStore(rootReducer,
    compose(
        applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
        reduxFirestore(fbConfig),
        reactReduxFirebase(fbConfig, {attachAuthIsReady:true, firebase:'firebaseReducer'})    )
);


const rrfProps = {
    firebase,
    config: fbConfig,
    dispatch: store.dispatch,
    createFirestoreInstance,
    userProfile: 'users', // where profiles are stored in database
    presence: 'presence', // where list of online users is stored in database
    sessions: 'sessions'
}




function AuthIsLoaded({ children }) {
    const auth = useSelector(state => state.firebase.auth)
    if (!isLoaded(auth)) return <div>Loading Screen...</div>;
        return children
}

store.firebaseAuthIsReady.then(() => {
 
    
    
    ReactDOM.render(
        <Provider store={store}>
            <ReactReduxFirebaseProvider {...rrfProps}>
            <AuthIsLoaded>
                <App />
                </AuthIsLoaded>
            </ReactReduxFirebaseProvider>
        </Provider>,
        document.getElementById('root'));
    serviceWorker.unregister();
    
    
})

Я попытался перезапустить npm start, снова установить react-redux, затем перезапустить npm start, запустить npm install и закрыть Vscode, а затем снова открыть его. То, что я пробовал, я очень смущен тем, почему это не сработало, но, пожалуйста, помогите мне исправить это, спасибо: D.

1. Какая версия react-redux у вас установлена? Как вы обновили react-redux? Вы действительно установили новую версию или просто указали ее в package.json?

2. Вам также следует установить пакет npm install

3. @DrewReese я использую версию 6.14.6 react-redux, для установки я запускаю команду в терминале npm install react-redux

4. @DennisVash Я попробовал это прямо сейчас, но это не сработало : (

5. Проще всего обновить указанную версию в package.json до нужной версии и запустить повторно npm i , или сначала удалить react-redux (чтобы удалить его из package.json), затем установить последнюю.

Ответ №1:

Хуки React Redux были впервые добавлены в версии 7.1.0, поэтому вы не можете импортировать useSelector хуки, если используете React Redux версии 6.46, как вы сказали.

Похоже, что вы работаете над проектом, похожим на учебник, поэтому я полагаю, что у вас нет никаких ограничений в отношении версий пакетов, и вы можете обновить его без существенных проблем. Имейте в виду, что для React Redux 7.1 требуется React 16.8.3 или более поздней версии, поэтому проверьте также версию React в вашем package.json файле.

Выполнить:

 npm uninstall react react-redux
npm i react react-redux

Затем проверьте, package.json содержит ли dependencies ваша запись "react-redux": "^7.2.1" и "react": "^16.13.1" .

Ответ №2:

вы должны обновить свой redux и версию react-redux. кроме того, имейте в виду, что вы не можете использовать «useSelector» из функционального компонента или компонента со стрелкой, и он должен быть дочерним для from redux.