【问题标题】:Uncaught TypeError: Super expression must either be null or a function, not undefined(…)未捕获的类型错误:超级表达式必须为 null 或函数,而不是 undefined(...)
【发布时间】:2017-04-01 01:03:20
【问题描述】:

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

reactjs giving error Uncaught TypeError: Super expression must either be null or a function, not undefined

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

我在下面添加了代码sn-p

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;

【问题讨论】:

  • 没有“Form”组件导入
  • 从 'react-bootstrap-validation' 导入 {Form,ValidatedInput};
  • 抱歉,我知道了。尝试在你的类声明之前做一些类似 console.log(ButtonInput) 的事情。看起来您的导入路径不正确。
  • 还有,this.handleValidSubmit = this.handleValidSubmit.bind(this);是什么
  • @degr 这是将正确的this 绑定到函数以供以后使用的常用方法。

标签: validation reactjs


【解决方案1】:

似乎与react-bootstrap 版本有冲突>= 0.30

降级您的react-boostrap 版本以兼容react-bootstrap-validation 可能会起作用。

官方问题线程是here。在作者发布更新以解决此兼容性问题之前,您可能需要降级您的 react-bootstrap 版本,即使它不是最理想的“解决方案”。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-06-11
    • 2016-09-23
    • 1970-01-01
    • 2021-02-12
    • 1970-01-01
    • 2016-05-05
    • 2016-10-07
    • 1970-01-01
    相关资源
    最近更新 更多