@WizardW

Как исправить ошибку с event handler и ts?

Container.tsx
import React, { useEffect, MouseEvent } from "react";
import { useDispatch } from "react-redux";
import Home from "../pages/Home";
import { initForm } from "../store/forms/actions";

export interface HomePageContainerProps {}

const HomePageContainer: React.SFC<HomePageContainerProps> = () => {
  const dispatch = useDispatch();
  useEffect(() => {
    dispatch(initForm());
  }, []);

  const handleColorChange = () => {
    console.log("123");
  };

  return <Home onClickColorChange={handleColorChange} />;
};

export default HomePageContainer;

Component.tsx
import "./style.sass";

import React, { MouseEvent } from "react";

export interface HeaderProps {
  onClickColorChange: () => void;
}

const Header: React.SFC<HeaderProps> = ({ onClickColorChange }) => {
  return (
    <div className="header">
      <div className="header-content">
        <ul className="header-content-line_rgelems">
          <li onClick={onClickColorChange}>Поменять цвет</li>
        </ul>
      </div>
    </div>
  );
};

export default Header;


На в контейнере вылазит ошибка:
Type '{ onClickColorChange: () => void; }' is not assignable to type 'IntrinsicAttributes & IndexProps & { children?: ReactNode; }'.
  Property 'onClickColorChange' does not exist on type 'IntrinsicAttributes & IndexProps & { children?: ReactNode; }'.

Что я забыл сделать?
  • Вопрос задан
  • 253 просмотра
Решения вопроса 1
Robur
@Robur
Знаю больше чем это необходимо
Почему у вас onClickColorChange в пропсах у Header в файле component.tsx, а передаете это свойство вы в Home из файла pages/home?
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы