使用react-Widgets

Question

我正在使用redux-form和react-widgets。我的表单有一个多选字段。我在表单中的字段如下所示：

<Field
    valueField="id"
    textField="label"
    label="Target Cities"
    name="target_city_ids"
    component={MultiSelectField}
    data={cities.map(city => {'id': city.id, 'label': city.name })}/>

我的MultiSelectField看起来像这样：

import React, { Component, PropTypes } from 'react';
import classNames from 'classnames'
import { Multiselect } from 'react-widgets'

const MultiSelectField = (field) => {
    let { input, label, meta: { error }, ...rest } = field

    let fieldClass = classNames({
        'form-group': true,
        'has-error': error
    })

    return (
        <div className={fieldClass}>
            <label className="control-label">{label}</label>
            <Multiselect
                className="rw-form-control"
                filter="contains"
                {...input}
                onBlur={() => input.onBlur()}
                value={input.value || []} // requires value to be an array
                {...rest}/>
            {error && <span className="help-block">{error}</span>}
        </div>
    )
}

目前，当我在multiselect中选择一个选项时，它会将该字段的值保存为对象：

{id:'x', label:'y'}

如何才能将id保存为值，而不是整个对象？

Answer 1

尝试使用valueField：

<Multiselect
    valueField="id"
/>