我在redux-form
中使用自定义单选按钮组件。我无法使其正常工作。遵循自定义组件代码。
import React, { PropTypes } from 'react';
import {
Col,
ControlLabel,
FormGroup,
Label,
} from 'react-bootstrap';
import { RadioGroup, Radio } from 'react-radio-group';
import _ from 'lodash';
import './style.css';
const FormRadioGroup = props => (
<FormGroup controlId={props.name || ''}>
<Col
componentClass={ControlLabel}
sm={props.labelColValue || 2}
className={props.labelClass || ''}
>
{ props.label || 'Checkbox Label'}
</Col>
<Col sm={props.radioColValue || 6}>
<RadioGroup
name={props.name}
selectedValue={props.input.value}
onChange={value => { props.input.onChange(value); }}
className="react-radio-group-button"
>
{
_.map(props.options, option =>
(
<Label>
<Radio value={option.key} />
{option.value}
</Label>
))
}
</RadioGroup >
</Col>
</FormGroup>
);
FormRadioGroup.propTypes = {
name: PropTypes.string,
labelColValue: PropTypes.number,
labelClass: PropTypes.string,
label: PropTypes.string,
radioColValue: PropTypes.number,
options: PropTypes.array,
disabled: PropTypes.boolean,
radioClass: PropTypes.string,
sendBoolean: PropTypes.boolean,
input: PropTypes.object,
meta: PropTypes.object,
};
export default FormRadioGroup;
在redux-form
我使用如下。
<Field
name="json_boolean_property"
component={FormRadioGroup}
format={value => (value ? 'yes':'no')}
parse={value => (value === 'yes')}
type="radio"
labelColValue={2}
label="Radio Group Label"
radioBoxColValue={6}
sendBoolean
options={[
{ key: 'yes', value: 'Yes' },
{ key: 'no', value: 'No' },
]}
/>
当我选择单击按钮来激活更改事件时,我无法设置服务器时的默认值,但同时它也会提供redux-form/UPDATE_SYNC_ERRORS
。
我不确定,我做错了什么但是它的失败非常糟糕。