मैं Redux-Form का उपयोग करके MapsAddrForm.jsx में एक फ़ॉर्म को कार्यान्वित करने का प्रयास कर रहा हूं और मैं अपने इनपुट तत्व के मान को परिवर्तित नहीं कर सकता। जब पृष्ठ लोड होता है, इनपुट तत्व कुंजीपटल इनपुट का जवाब नहीं देता है, और जब फॉर्म फ़ील्ड सबमिट करता है, तो यह मूल घटक जिलाफ़िंडर को खाली ऑब्जेक्ट देता है। इन दो फाइलों के अलावा, मैंने फॉर्म भी जोड़ा है: रेडक्स-फॉर्म ट्यूटोरियल में सरल उदाहरण की तरह रेड्यूसर को गठबंधन करने के लिए फॉर्म रेड्यूसर। क्या जिलाफाइंडर को पता फॉर्म से डेटा ऑब्जेक्ट प्राप्त करने की क्षमता बहाल करने का कोई तरीका है? संदर्भ के लिए, मैं प्रतिक्रिया 15.1.0 का उपयोग कर रहा हूं, रीड-रेडक्स 4.4.5, ईएस 6, और रेडक्स-फॉर्म 5.3.1, वेबपैक का उपयोग करके संकलित सभी।रेडक्स-फॉर्म: इनपुट तत्वों के मान को बदलने में सक्षम नहीं
MapsAddrForm.jsx
import React, {Component} from 'react';
import { connect } from 'react-redux';
import {reduxForm} from 'redux-form';
class MapsAddrForm extends Component {
constructor(props) {
super(props);
}
render() {
const {fields: {address,address2}, handleSubmit} = this.props;
return (
<form onSubmit={handleSubmit}>
<div>
<input type="text" placeholder="Your address" {...address}/>
</div>
<button type="submit">Submit</button>
</form>
);
}
}
export default reduxForm({
form: 'addressForm',
fields: ['address']
})(MapsAddrForm);
DistrictFinder.jsx
import React, { Component, PropTypes } from 'react'
import MapsAddrForm from './MapsAddrForm.jsx'
import { connect } from 'react-redux'
import { changeAddress } from '../actions/index.jsx'
class DistrictFinder extends Component {
constructor(props) {
super(props);
this.handleAddrSubmit = this.handleAddrSubmit.bind(this);
}
handleAddrSubmit(data) {
console.log("Address received: " + JSON.stringify(data));
}
render() {
const {address, district} = this.props
return (
<div class="GMaps">
<h1>Find your district!</h1>
<MapsAddrForm onSubmit={this.handleAddrSubmit} />
<p>My district number is: {district}</p>
</div>
);
}
}
DistrictFinder.propTypes = {
district: PropTypes.string.isRequired,
dispatch: PropTypes.func.isRequired
};
function mapStateToProps(state) {
const { district } = state.infoChange;
return {
district
};
};
export default connect(mapStateToProps)(DistrictFinder);