redux-form

Dynamically load initialValues in Redux Form

天大地大妈咪最大 提交于 2019-12-18 13:13:31
问题 Using the example of initializingFromState within Redux-Form, I am trying to set this up dynamically. This is to edit a particular book in a list of books, and is using a simple api set up in express.js. The full container is below. I somehow need to pass in initialValues , within the mapStateToProps function. In the example, it is done via a static object, but I can't work out how to use the information I have pulled in via fetchBook , and pass it to initialValues . Container: import React,

Using redux-form I'm losing focus after typing the first character

早过忘川 提交于 2019-12-18 11:52:17
问题 I'm using redux-form and on blur validation. After I type the first character into an input element, it loses focus and I have to click in it again to continue typing. It only does this with the first character. Subsequent characters types remains focuses. Here's my basic sign in form example: import React, { Component } from 'react'; import { connect } from 'react-redux'; import { Field, reduxForm } from 'redux-form'; import * as actions from '../actions/authActions'; require('../../styles

Set value in field in redux form

故事扮演 提交于 2019-12-18 11:45:53
问题 I have redux form having dropdown and text fields. On dropdown change i have to update the other fields. The other fields are using custom component example So the structure is like. 1. component having form 2. Field component. Now i googled and found few things to update the field but not able to do it. What i tried 1. Adding state in the field like below in value. Does not work. <Field name="accountno" value="this.state.accountno" component={InputText} placeholder="Number" /> Tried disptach

Redux Form: How to handle multiple buttons?

蓝咒 提交于 2019-12-18 02:09:08
问题 I am trying to add a second submit button to a redux-form. Both buttons should dispatch an action that saves the data but depending on the button pressed the user should be routed to different pages. So I defined a handler that I pass as onSubmit prop to the form. But as far as I can see only the form data is passed to this handler: The docs on handleSubmit note: A function meant to be passed to <form onSubmit={handleSubmit}> or to <button onClick={handleSubmit}> . It will run validation,

Redux-Form initial values from

浪子不回头ぞ 提交于 2019-12-17 22:56:09
问题 I'm trying to fill the profile form with data from API. Unfortunately redux-form doesn't want to cooperate with me in this case. For some reason fields stays empty whatever I do. Setting the fixed values instead of values passed from reducer work well for some reason. Maybe this is because I'm using redux-promise for API calls inside the action creators? How can I live with it and get rid of this. Here is my form component. import React, { Component } from 'react'; import { reduxForm, Field }

Load Data Asynchronously not working using redux-form

白昼怎懂夜的黑 提交于 2019-12-14 04:09:17
问题 I am trying to load data to form asynchronously using redux-form v6.7.0, but it is not working. I referred this link. Below is my sample code. Any help would be appreciated. Thanks in advance. /* reducers should always maintain immutability */ var personInfo = { name: "", age: "" }; function PersonInfoReducer(state = personInfo, action) { switch (action.type) { case "SAVE_PERSON_DATA": return Object.assign({}, state, action.payload); default: return state; } } /* save person data action */

Redux-Form : How to mock formValueSelector in Jest

心已入冬 提交于 2019-12-14 03:57:49
问题 I have a component Demo whose Label depends on the current value of a field in the redux-form state. I am using formValueSelector to get the current value of "param" field from the form state. It works fine. However, while running npm test, the selector function always returns undefined. How can I mock it? Please let me know if I am doing this in a wrong way. I have a component like class Sample extends React.Component { render() { const {param, state} = this.props; const selector =

redux form data not persisting once componentUnMounts

谁说我不能喝 提交于 2019-12-13 03:55:07
问题 i have a component , where i am having a wizard form , first tab will ask the mark details of student and second tab will ask the basic details of the student. so from cookie i am getting the username on the second tab like auto fill. so my entire component consist of index.js , wizardformmarks , wizardformdetails. index.js render(){ return( <WizardFormMarks initialValues={this.props.initialValues}/> <WizardFormDetails initialValues={this.props.initialValues}/> ) } const mapStateToProps =

React Redux-Form using child components with child components that have multiple submits

雨燕双飞 提交于 2019-12-12 05:19:39
问题 New to React-Redux. I have a child component that uses the following with "handleSubmit" and this part of the code works. <span style={textLinkStyle} onClick={handleSubmit(values => props.onSubmit({ ...values, sortBy: 'ClientNumber' } ))}> <span>Client # </span> </span> Here is the above code's child component with all the relevant parts. export const TableHeaders = (props) => { const { handleSubmit } = props const { sortBy, sortDirection } = props return ( <div> <div className="row"> <div

How to pass a redux store into dynamically rendered redux-form component?

为君一笑 提交于 2019-12-12 04:57:38
问题 I have a React Redux application, which is using redux-form. Form is render dynamically by event. While it render, I'am getting an error Uncaught Error: Could not find "store" in either the context or props of "Connect(Form(FormCreate))" To fix error, I explicitly pass a store into Form component, as bellow render(<FormCreate store={store}/>, document.getElementById('form')) But store also needed by redux-form custom render fiedls. For example <Field store={store} component={renderField} type