我有一个问题，我无法在React中解决。我的目的是定义一个按钮回调函数，它将设置redux中的状态值，这个回调函数使用dispatch函数，其中的两个值包含两个不同的redux状态。看起来这些说明

//Saving select selected value from redux store
const selectedValue: string|undefined = useSelector((state: RootState) => state.selectedOption);

//2. Save the input value from the redux store
const inputValue: string|null = useSelector((state: RootState) => state.inputTextValue);

在redux中的store的实际初始化之前执行，所以react给了我这个问题---〉“Could not find react-redux context value;请确保组件 Package 在”
我试着这样定义它：
App.tsx

import React, { useCallback } from 'react';
import './App.css';
import { Card } from './components/organism/Card';
import { useState } from "react";
import { Context } from './context/Context'
import { imgData } from "./context/Context";
import { Provider, useDispatch, useSelector } from "react-redux";
import StudentExercise from "./components/organism/studentExercise/studentExercise";
import { createStore } from "redux";
import rootReducer from "./redux";
import { composeWithDevTools } from "redux-devtools-extension";
import { optionsArray } from "./redux/reducers/SelectedOption/selectedOption";
import {
  setBirthYear,
  setCourse,
  setName,
  setSurname,
  setTutor
} from "./redux/actions";

export type RootState = ReturnType<typeof store.getState>

// todo: cercare metodo non deprecato
const store = createStore(rootReducer, composeWithDevTools());// Reducer store

function App() {
  // States
  const [value, setValue] = useState('My context value');
  const [imageData, setImageData] = useState(imgData); 

  // Callbacks:
  const dispatch = useDispatch();

  // Saving selected value from redux store 
  const selectedValue: string|undefined = useSelector((state: RootState) => state.selectedOption);

  // 2. Saving another value from redux store
  const inputValue: string|null = useSelector((state: RootState) => state.inputTextValue);

  // Callbacks:
  const handleClick = useCallback(()=> {
    switch(selectedValue) {
      case "name":
        console.log("Selected value --> ",selectedValue);
        console.log(inputValue);
        return dispatch(setName(inputValue));
      case "surname":
        return dispatch(setSurname(inputValue));
      case "birthYear":
        return dispatch(setBirthYear(inputValue));
      case "course":
        return dispatch(setCourse(inputValue));
      case "tutor":
        return dispatch(setTutor(inputValue));
      default:
        return selectedValue;
    }
  }, [dispatch]);

  return (
    <>
      <div className="App">
        <Provider store={store}> {/* Redux store */}
          <Context.Provider value={{ value, setValue }}> {/* Esercizio card */}
            <Card />
          </Context.Provider>

          <StudentExercise 
            clickHandler={handleClick} 
            title={"changing values!"}
          />
        </Provider>
      </div>
    </>
  );
}

export default App;

我的期望是在最外层的组件中定义一个回调，在本例中是App，这样我就可以重用StudentExercise组件，但handleClick作为prop传递。