Как выставить функцию FunctionComponent докладчику? - PullRequest
Новая
       6

Как выставить функцию FunctionComponent докладчику?

0 голосов
/ 02 июня 2019

У меня возникают проблемы при попытке представить вложенные функции FunctionComponent моему докладчику для вызова.Это прекрасно работает с ClassComponent однако.Как еще можно оценить вложенную функцию markFormAsDirty в моем Presenter, если я хочу использовать FunctionComponent для использования хуков?Потратил немало времени, пытаясь понять это.Моя конечная цель - использовать FunctionComponent вместо ClassComponent, чтобы я мог начать использовать хуки во всем проекте.

SignInComponent 

const SignIn: React.FC<Props> = (props: Props) => {
    const [state, setState] = React.useState<SignInState>({
        pristine: true,
        username: "",
        password: ""
    });

    // --- I want presenter to be able to invoke this
    const markFormAsDirty = () => {
        setState({ ...state, pristine: false });
    };

    return (
        <div className="sign-in-container">
            // markup stuffs
        </div>
    );
};

export default WithPresenter(SignIn, SignInPresenter);

SignInPresenter

class SignInPresenter implements Presenter {
    view: any; // typed it to any just temporarily

    constructor(view: any) {
        this.view = view;
    }

    public validateFields = (username: string, password: string) => {
        if (this._isValidUsername(username) && password) {
            this.view.markFormAsDirty(); <-- this is undefined if I use FunctionComponent
        } else {
            alert("invalid");
        }
    };
}

export default SignInPresenter;
...