我有一个redux-form字段(源文件),它正在通过应用程序状态的更改进行更新。状态值正在正确传递到字段,但是当单击提交时,只提交第一个字段(名称)(我以交互方式填写)。
我在这里做错了什么?
import React, { Component, PropTypes } from 'react';
import { reduxForm, Field } from 'redux-form';
import { connect } from 'react-redux';
import { Link } from 'react-router';
import * as actions from '../../actions/job_actions';
import UploadPage from './upload_page';
const renderField = field => (
<div>
<label>{field.input.label}</label>
<input {...field.input}/>
{field.touched && field.error && <div className="error">{field.error}</div>}
</div> );
class JobForm extends Component {
handleFormSubmit(formProps) {
this.props.createJob(formProps); }
render() {
const { handleSubmit } = this.props;
return (
<div>
<form onSubmit={handleSubmit(this.handleFormSubmit.bind(this))}>
<label>Title</label>
<Field name="name" component={renderField} type="text" />
<label>Input File</label>
<Field name="source_file" component={() => {
return (
<div class="input-row">
<input type="text" value={this.props.uploadedFile} />
</div>
)
}} />
<button type="submit" className="btn btn-
primary">Submit</button>
</form>
</div>
);
};
}
const form = reduxForm({ form: 'JobForm' });
function mapStateToProps({uploadedFile}) { return { uploadedFile }; }
export default connect(mapStateToProps, actions)(form(JobForm));
答案 0 :(得分:0)
如果您希望redux-form包含您的字段,那么您需要将其渲染为实际字段(就像使用renderField
一样)。
如果您不想将其视为实际字段,则redux-form作者建议使用injecting the values from state within your submit handler。也许是这样的:
handleFormSubmit(formProps) {
this.props.createJob({ ...formProps, source_file: this.props.uploadedFile} );
}