0
votes

Si l'objet est déjà en état, n'ajoutez pas une nouvelle entrée

Bonjour mon but est simple mais je trouve difficile à réaliser:

J'ai la fonction suivante qui s'appelle chaque fois qu'un utilisateur modifie l'un des champs de mon formulaire: P>

[{field: 'job' , project : 123 , value : 'ent'}]

javascript reactjs

0 commentaires

5 Réponses :

2
votes

Peut-être que vous devriez utiliser un objet au lieu d'un tableau, alors?

Ensuite, votre état initial peut être {} et lorsque vous modifiez quelque chose, ajoutez sa valeur au champ d'objet déjà défini. Par exemple, la ligne SetfieldValues ressemblerait à quelque chose comme ceci alors en supposant que le nom est unique: xxx

Si vous avez besoin de l'état pour que l'état soit propérable, vous pourriez aussi Pensez à utiliser un carte

0 commentaires

1
votes

const handleChange = (e) => {
    const { value , name , id } = e.target; 
    let projects = fieldValues.map(val => val.project);
    if (projects.includes(id) {
         let newFieldValues = [...fieldValues];
         newFieldValues[projects.indexOf(id)] = { value, field: name, project: id }
         setFieldValues(newFieldValues)
         } else {
            setFieldValues(prev => ([...prev, {value, field: name , project : id}]))
  }
}

0 commentaires

2
votes

Essayez ceci:

const handleChange = (e) => {
    const { value, name, id } = e.target;
    setFieldValues(prev => {
        const existingIndex = prev.findIndex(el => (el.field === name) && (el.project === id));
        const newFields = [...prev];
        if (existingIndex >= 0) {
            newFields[existingIndex] = { ...newFields[existingIndex], value };
            return newFields;
        }
        newFields.push({ value: value, field: name, project: id });
        return newFields;
    })
}

0 commentaires

0
votes

Essayez quelque chose comme ceci: xxx pré>

champs d'entrée Exemple: p>

<Form.Control type="text" name="input1" value={this.state.input1} onChange={(ev)=>this.changeHandler(ev.target.name, ev.target.value)} />
<Form.Control type="text" name="input2" value={this.state.input2} onChange={(ev)=>this.changeHandler(ev.target.name, ev.target.value)} />
<Form.Check name="input3" checked={this.state.input3} onChange={(ev)=>this.changeHandler(ev.target.name, ev.target.checked)} />

0 commentaires

0
votes

Essayez de remplacer l'objet que vous avez déjà défini en créant un nouveau à chaque fois, il remplacera donc des champs qui ne sont pas encore définis avec de nouvelles valeurs xxx

si vous n'avez pas à garder champs dans un tableau, juste faire xxx

0 commentaires