Блог

Главная - Вопросы по программированию - Как преобразовать useContext в typescript

Как преобразовать useContext в typescript

#reactjs #typescript #use-context

#reactjs #typescript #использовать-контекст

Вопрос:

Как я могу заставить функцию setDay работать в typescript, в javascript это работало нормально, контекст должен получать только числа в качестве аргументов :

 const SetScreen = React.createContext();

 
   const { setDay }  = useContext(SetScreen);


  return (
    <nav>
      {programDays.map((days, idx) => {
        return (
          <button
            key={days}
            onClick={() => {
              setDay(idx);
                          }}
                     >
                    </button>
        );
      })}
      </nav>
  );
};

export default Nav;
 
 function App() {
  const [day, setDay] = useState(0);
  return (
    <div className="App">
      <SetScreen.Provider value={day}>
        <Nav />
        <DailySchedule day={day} />
      </SetScreen.Provider>
    </div>
  );

Комментарии:

1. Вам нужно создать интерфейс или тип, который соответствует типу значения контекста, и передать его createContext вызову, т.е. React.createContext<ContextType>() .

2. значением будет число, поэтому я попробовал const setScreen = React.createContext<число>(0) , но затем я получаю сообщение об ошибке «Свойство ‘setDay’ не существует для типа ‘Number'»

3. Это не имеет значения для контекста. Значение контекста — это то, что useContext() возвращается. Если вам нужна помощь в создании типа, пожалуйста, отредактируйте свой пост, чтобы включить компонент, в котором вы создаете состояние, то есть компонент, который использует <SetScreen.Provider>