反応-Reduxのアップロードファイルのエラーに

Question

を私が反応し-ReduxのをReduxの形式を使用して上のファイルのアップロードを実装しようとするが、警告およびコンソールで例外があります。

警告：ConnectedFieldはタイプの制御不能な入力を変化させているが、ファイルは となります。入力要素は制御されていない状態から制御された状態に切り替わるべきではない （またはその逆）。制御された入力または制御されていない入力 要素をコンポーネントの存続期間中使用するかどうかを決めます。ここで

bundle.js:37467 Uncaught DOMException: Failed to set the 'value' property on 
'HTMLInputElement': This input element accepts a filename, which may only be 
programmatically set to the empty string. 
     at Object.updateWrapper (http://localhost:8080/dist/bundle.js:37467:20) 
     at ReactDOMComponent.updateComponent (http://localhost:8080/dist/bundle.js:36891:23) 
     at ReactDOMComponent.receiveComponent (http://localhost:8080/dist/bundle.js:36846:10) 
     at Object.receiveComponent (http://localhost:8080/dist/bundle.js:6247:22) 
     at ReactCompositeComponentWrapper._updateRenderedComponent (http://localhost:8080/dist/bundle.js:35859:23) 
     at ReactCompositeComponentWrapper._performComponentUpdate (http://localhost:8080/dist/bundle.js:35829:10) 
     at ReactCompositeComponentWrapper.updateComponent (http://localhost:8080/dist/bundle.js:35750:12) 
     at ReactCompositeComponentWrapper.receiveComponent (http://localhost:8080/dist/bundle.js:35652:10) 
     at Object.receiveComponent (http://localhost:8080/dist/bundle.js:6247:22) 
     at ReactCompositeComponentWrapper._updateRenderedComponent (http://localhost:8080/dist/bundle.js:35859:23) 

は私のコンポーネントのコードです：

import React,{Component} from 'react'; 
import {Field, reduxForm} from 'redux-form'; 

class UploadFileForm extends Component { 

    onFormSubmit(data) { 
    console.log(data); 
    }; 

    render() { 
    return (
     <form role="form" onSubmit={this.props.handleSubmit(this.onFormSubmit)}> 
     <div className="form-group"> 
      {/*<input name="file" type="file" className="file file-loading" data-allowed-file-extensions='[".owl"]'/>*/} 
      <Field name="owl-file" component="input" type="file" ref="owl-file-ref"/> 
      <label className="choose-file-info"></label> 
     </div> 
     <button type="submit" className="btn btn-primary">Upload</button> 
     </form> 
    ); 
    } 
} 

export default reduxForm({ 
    form: 'upload' 
})(UploadFileForm); 

Answer 1

以下は私のために働きました。

const UploadFile = ({ input: {value: omitValue, ...inputProps }, meta: omitMeta, ...props }) => (
    <input type='file' {...inputProps} {...props} /> 
); 

次に、このように使用します。

溶液が中に発見された

<Field component={UploadFile} name='file' accept='.jpg' /> 

： https://github.com/erikras/redux-form/issues/1989