So erhalten Sie Redux-Formulardaten in einer anderen Komponente

Question

Wie kann ich die Daten aus redux-Formular übergeben, damit ich auf diese Daten in App.js zugreifen kann? Hier ist der Code, den ich mit redux-form geschrieben habe. Nachdem ich auf submit geklickt habe, sollten die Daten von form.js an app.js übergeben werden. und die Daten sollten auf der Seite angezeigt werden.

hier ist form.js-

const Form=({fields:{name,address}})=>(
    <form> 
    <center> 
    <div> 
     <label>First Name</label> 
     <Field type="text" component="input" placeholder="Name" name="name"/> 
    </div> 
    <div> 
     <label>Address</label> 
     <Field type="text" component="input" placeholder="Phone" name="phone" /> 
    </div> 
    <button type="submit">Submit</button> 
    </center> 
    </form> 
) 


export default reduxForm({ 
    form: 'form', 
    fields: ['name', 'address'] 
})(Form); 

Wie kann ich diese inputed Daten passieren app.js?

Answer 1

Was Sie tun müssen, ist getFormValues zu verwenden, um die Werte redux field

So in App.js bekommen Sie haben

import {getFormValues} from 'redux-form'; 

.. 
const App = (props) => { 
     var {name, phone} = props.formStates 
     console.log(name, phone); 
} 

function mapStateToProps(state) { 
    return { 
     formStates: getFormValues('form')(state) // here 'form' is the name you have given your redux form 
    } 
} 

export default connect(mapStateToProps)(App)