Я создал контактную форму мастера, где на определенном этапе у меня появляется «Кнопка входа в Google», если пользователь входит в систему с Google, то некоторые поля CF заполняются данными Google ( имя, фамилия, адрес электронной почты).
Все работает нормально, но я заметил, что как только пользователь входит в систему и поля заполняются, предыдущие данные формы (данные, которые я получил на предыдущих шагах) теряются и заменяются полностью на «имя», «фамилия» и электронная почта.
Чтобы решить эту проблему, я попытался использовать «keepDirtyOnReinitialize», но, похоже, ничего не изменилось, и я действительно не знаю, как заставить это работать на этом этапе.
Это мой код, где я создаю форму и откуда я получаю информацию из магазина Redux:
import React from 'react'
import { Field, reduxForm } from 'redux-form'
import { connect } from 'react-redux'
class Info extends React.Component {
renderError({ error, touched }) {
if (touched && error) {
return <div>{error}</div>
}
}
renderInputField = ({ input, label, meta }) => {
return (
<div>
<input {...input} type="text" placeholder={label} />
{this.renderError(meta)}
</div>
);
};
onSubmit = (formValues) => {
this.props.onSubmit(formValues)
}
render() {
const { handleSubmit } = this.props
return (
<div>
<form onSubmit={handleSubmit(this.onSubmit)}>
<div>
<Field
name="nome"
component={this.renderInputField}
label="Nome *"
/>
</div>
<div>
<Field
name="cognome"
component={this.renderInputField}
label="Cognome *"
/>
</div>
<div>
<Field
name="email"
component={this.renderInputField}
label="Email *"
/>
</div>
<div>
<Field
name="azienda"
component={this.renderInputField}
label="Azienda"
/>
</div>
<div>
<Field
name="citta"
component={this.renderInputField}
label="Città / CAP / Provincia"
/>
</div>
<button>Visualizza</button>
</form>
</div>
)
}
}
const validate = formValues => {
const errors = {}
if (!formValues.nome) {
errors.nome = "Aggiungi il nome"
}
if (!formValues.cognome) {
errors.cognome = "Aggiungi il cognome"
}
if (!formValues.email) {
errors.email = "Aggiungi l'email"
} else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(formValues.email)) {
errors.email = 'Email non valida'
}
return errors
}
const mapStateToProps = (state) => {
let initValues
if (state.auth.isSignedIn) {
initValues = {
nome: state.auth.userProfile.ofa,
cognome: state.auth.userProfile.wea,
email: state.auth.userProfile.U3
}
}
return {
userData: state.auth,
initialValues: initValues
}
}
export default connect(mapStateToProps)(reduxForm({
form: 'companyData',
destroyOnUnmount: false,
//forceUnregisterOnUnmount: true,
enableReinitialize: true,
keepDirtyOnReinitialize: false,
validate
})(Info))
Это мои данные, прежде чем я войду в систему:
И это данные после того, как я войду в Google и восстановлю данные, заполнив поля
initialValues сбрасывает все данные и создает эти новые три, но в соответствии с документацией формы Redux я могу сохранить предыдущие данные, используя keepDirtyOnReinitialize, но это не работает.
Моя версия Redux Form: 8.1.0
Есть идеи?