当前位置:  开发笔记 > 编程语言 > 正文

自定义输入 - Redux表单

如何解决《自定义输入-Redux表单》经验,为你挑选了1个好方法。

我有以下CustomInput组件:

import React from 'react';

const CustomInput = props => (
  
); CustomInput.propTypes = { inputType: React.PropTypes.oneOf(['text', 'number']).isRequired, title: React.PropTypes.string.isRequired, name: React.PropTypes.string.isRequired, controlFunc: React.PropTypes.func.isRequired, content: React.PropTypes.oneOfType([ React.PropTypes.string, React.PropTypes.number, ]).isRequired, placeholder: React.PropTypes.string, }; export default CustomInput;

这是我的形式:

import React, { PropTypes } from 'react';
import { Field, reduxForm } from 'redux-form';
import CustomInput from '../components/CustomInput';

const renderMyStrangeInput = field => (
   field.input.onChange(param.val)}
    content={{ val: field.input.value }}
    placeholder={'Number of items'}
  />
);

class ItemsForm extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    const { handleSubmit } = this.props;
    return (
      

Nuevo Pedido

); } } ItemsForm.propTypes = { }; ItemsForm = reduxForm({ form: 'Items', })(ItemsForm); export default ItemsForm;

我可以渲染我的组件,但内容类型存在一些问题.首先,如果我设置CustomInput接受数字我得到:

he specified value "[object Object]" is not a valid number. The value must match to the following regular expression: -?(\d+|\d+\.\d+|\.\d+)([eE][-+]?\d+)?

其次,如果我设置inputType为文本,它会呈现:

[object Object]

所以,控制台发出以下警告:

Warning: Failed prop type: Invalid prop `content` supplied to `CustomInput`.

如何正确设置内容?



1> Kejt..:

我认为问题是你正在尝试将字符串作为对象传递

 field.input.onChange(param.val)}
    content={field.input.value}
    placeholder="Number of items"
  />

推荐阅读
落单鸟人
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有