SHARE
TWEET

Untitled

a guest Jul 22nd, 2019 65 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. Type 'void' is not assignable to type '((event: MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined'
  2.      
  3. interface RegistrationProps {
  4.     login: LoginState
  5. }
  6.  
  7. interface RegistrationState {
  8.     login: string,
  9.     name: string,
  10.     lastName: string,
  11.     activeStep: number,
  12. }
  13.  
  14. export class Registration extends React.Component<RegistrationProps, RegistrationState> {
  15.     constructor(props: any) {
  16.         super(props)
  17.         this.state = {
  18.             login: '',
  19.             name: '',
  20.             lastName: '',
  21.             activeStep: 1
  22.         }
  23.     }
  24.  
  25.     private renderSteps = (step: number) => {
  26.         const classNameStep1 = step === 1 ? "activeStep" : "step";
  27.         const classNameStep2 = step === 2 ? "activeStep" : "step";
  28.         const classNameStep3 = step === 3 ? "activeStep" : "step";
  29.  
  30.         return (
  31.             <React.Fragment>
  32.             <div className={classNameStep1}>Логин и имя</div>
  33.             <div className={classNameStep2}>Персональные данные</div>
  34.             <div className={classNameStep3}>Пароль</div>
  35.             </React.Fragment>
  36.         )
  37.     }
  38.  
  39.     private renderFormsSteps = (step: number) => {
  40.        if (step === 1) {
  41.            return (
  42.                <div>
  43.                    <div>Логин и имя</div>
  44.                    <div><button onClick={this.handleNextStepButton(step)} type="button" className="btn btn-dark">Next</button></div>
  45.                </div>
  46.            );
  47.        } else if (step === 2) {
  48.            return (
  49.                <div>Персональные данные</div>
  50.            );
  51.        } else if(step === 3) {
  52.            return (
  53.                <div>Пароль</div>
  54.            );
  55.        } else {
  56.            return (
  57.                <div>...</div>
  58.            );
  59.        }
  60.     }
  61.  
  62.     private handleNextStepButton = (nextStep: number)  => {
  63.         this.setState({activeStep: nextStep});
  64.     }
  65.  
  66.     public render() {
  67.         const {activeStep} = this.state;
  68.         return (
  69.             <Container>
  70.             <div className="registrationHead">
  71.                 <Link to="/"> Вернуться </Link>
  72.             </div>
  73.             <div className="registrationTitle">Регистрация</div>
  74.             {this.renderSteps(activeStep)}
  75.             {this.renderFormsSteps(activeStep)}
  76.             </Container>
  77.         );
  78.     }
  79. }
  80.  
  81. Если что (зависимости):
  82.  
  83. "@types/react": "^16.8.23",
  84. "@types/react-dom": "^16.8.4",
  85.  "typescript": "^3.5.3"
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top