无法在Select中加载defaultProptypes-Ant Design

时间:2018-09-05 10:06:41

标签: javascript reactjs antd next.js react-redux-form

您能帮忙解决这个问题吗?我在next.js中使用ANT Design,但无法加载在未定义的默认Proptypes. isSelectOptGroup中定义的列表-这是我经常收到的消息。 因此,基本上renderSelectoptions(Items)是接受Items数组的函数,此后应在屏幕上显示。但是那没有发生。

import React, { PureComponent } from 'react'
import PropTypes from 'prop-types';

import { Select as AntSelect, Option as AntOption } from './Select'
import FormItem from '../FormItem'
import Form from '../Form'


const propTypes = {
  // onChange: PropTypes.func.isRequired,
  form: PropTypes.object.isRequired,
  items: PropTypes.array,
  name: PropTypes.string,
  label: PropTypes.string,
  placeholder: PropTypes.string,
  options: PropTypes.object,
};

const defaultProps = {
  items: [
    {
      key: 1,
      value: 360,
      label: 'RSD'
    },
    {
      key: 2,
      value: 460,
      label: 'EuR'
    }
  ],
  name: 'hello',
  placeholder: 'RSD',
  label: 'Currency',
  options: { rules: [{ message: 'Please chose currency!' }] }
};

class Select extends PureComponent {
  handleSelectChange = (value) => {
    const { /*onChange,*/ form, name } = this.props
    form.setFieldsValue({
      [name]: value,
    });

    // onChange(value)
  }

  renderSelectOptions = items => items.map(item => (
    <AntOption key={item.key} value={item.value}>{item.label}</AntOption>))

  render() {
    const { name, label, placeholder, items, options, form } = this.props;
    return (
      <Form>
        <FormItem label={label}>
          { form.getFieldDecorator(name, { ...options })(
            <AntSelect
              size="large"
              placeholder={placeholder}
              onChange={this.handleSelectChange}
            >
              {items && this.renderSelectOptions(items)}
            </AntSelect>
          )}
        </FormItem>
      </Form>
    )
  }
}

Select.defaultProps = defaultProps;
Select.propTypes = propTypes;

const WrapperSelect = Form.create()(Select);

export default WrapperSelect;

0 个答案:

没有答案