J'ai ce code dans mon constructeur: J'ai la fonction d'édition où je lis la valeur d'événement dans mon entrée: Mais es-je donnez-moi cet avertissement: Ne pas muter l'état directement. Utilisez Que puis-je faire dans ce cas? Peut-être changez-vous en quelque sorte la ligne avec l'attribution
instate ()
réagir / non-directe-mutation-état
event.target.value dans SETState () ?
6 Réponses :
Une façon dont j'ai tendance à partir est de faire une copie du tableau d'abord, puis de modifier un élément dedans ou de modifier la matrice elle-même, puis définissez l'état vous pouvez Voulez-vous profondément cloner le tableau dans certains cas, parfois pas.
Ce n'est pas correct. Vous aurez toujours une référence car la matrice est une gamme d'objets.
Tous les composants ne réagissent pas ne nécessitent pas de copie en profondeur de tout.
Vous êtes correct, que le problème est avec la ligne:
const {value} = event.target;
this.setState(prevState => update(prevState, {[id]: {user: {$set: value}}}));
Vous pouvez utiliser mapper () pour créer une copie de tests
edit(id, event) {
var newNote = {...this.state.tests[id]}
newNote.user = event.target.value
this.setState({ tests: [...this.state.tests, newNote]})
}
S'il vous plaît expliquer votre réponse à fond.
Lorsque l'état n'est pas lourd, j'utilise les codes suivants: mise à jour: j'ai trouvé Immer le résout parfaitement. P> import produce from 'immer'
edit (id, event) {
this.setState(
produce(draft => draft.tests[id].user = event.target.value)
)
}
Tout d'abord, lorsque vous essayez de définir un nouvel état à l'aide des données de l'état précédent, vous devez utiliser la mise à jour en fonction de la fonction. https://reactjs.org/docs/react-component.html#setstate
const edit = (id, event) => {
this.setState((prevState) => {
const tests = [...prevState.tests];
tests[id] = {
...tests[id],
user: event.target.value
};
return {
...prevState,
tests
};
});
};
Créez une copie de l'état, puis militez la copie.