未捕获的TypeError:超级表达式必须为null或函数,而不是未定义(...)

时间:2016-11-17 13:05:23

标签: validation reactjs

跟踪此问题的问题无法解决我的问题。

http://jsfiddle.net/5cbroe1f/

我的反应版本是“^ 15.3.1”。

我已在下面添加了代码段

import React from 'react';
import { ButtonInput } from 'react-bootstrap';
import {Form,ValidatedInput} from 'react-bootstrap-validation';

class myComponent extends React.Component {
  constructor(props) {
    super(props);
    this.handleValidSubmit = this.handleValidSubmit.bind(this);
    this.handleInvalidSubmit = this.handleInvalidSubmit.bind(this);

  }
  handleValidSubmit(values){

  }
  handleInvalidSubmit(errors,values){

  }
  render() {
    return (
        <Form   onValidSubmit={this.handleValidSubmit}
                onInvalidSubmit={this.handleInvalidSubmit}>

                <ValidatedInput
                    type='text'
                    label='Email'
                    name='email'
                    validate='required,isEmail'
                    errorHelp={{
                        required: 'Please enter your email',
                        isEmail: 'Email is invalid'
                    }}
                />

                <ValidatedInput
                    type='password'
                    name='password'
                    label='Password'
                    validate='required,isLength:6:60'
                    errorHelp={{
                        required: 'Please specify a password',
                        isLength: 'Password must be at least 6 characters'
                    }}
                />

                <ValidatedInput
                    type='password'
                    name='password-confirm'
                    label='Confirm Password'
                    validate={(val, context) => val === context.password}
                    errorHelp='Passwords do not match'
                />


                <ValidatedInput
                    type='checkbox'
                    name='agree'
                    label='I agree to the terms and conditions'
                    validate='isChecked'
                />

                 <ButtonInput
                    type='submit'
                    bsSize='large'
                    bsStyle='primary'
                    value='Register'
                />

            </Form>
    );
  }
}

module.exports = myComponent;

1 个答案:

答案 0 :(得分:0)

似乎与react-bootstrap版本&gt; = 0.30存在冲突。

降低react-boostrap版本与react-bootstrap-validation的兼容性可能会有效。

官方发行帖子是here。在作者发布更新以解决此兼容性问题之前,您可能需要降级react-bootstrap版本,即使它是次优的“解决方案”。