javascript - Comment forcer l'actualisation d'un composant dans React?

Question

Il y a une balise <img src='127.0.0.1/img' /> à l'intérieur du composant pour charger l'image via l'URL. On suppose qu'une image entièrement blanche est initialement renvoyée
Après que l'utilisateur clique sur un. bouton, l’image de traitement d’arrière-plan devient entièrement noire.
Pour le moment, j'espère que le client pourra actualiser automatiquement cette modification et que l'image s'affichera complètement en noir.
Le changement d'état ne semble pas provoquer une autre demande d'adresse 'src='127.0.0.1/img'.
Existe-t-il un moyen d'y parvenir ?
//------------------
Posez une autre question. . React peut-il être utilisé avec redux sans réagir-redux ? S'il n'est pas utilisé, comment le magasin peut-il être distribué à chaque composant ?

//index.js
const store = createStore();
render(
        <component_a />
        <component_b />
    ,document.getElementById('app'));

Answer 1

Bien que je ne sache pas de quoi vous parlez, si vous souhaitez simplement recharger l'image après que l'utilisateur l'a modifiée, vous pouvez définir un indicateur pour déterminer si l'image a été exploitée. Une fois l'opération terminée, utilisez setState pour. changez le drapeau pour atteindre l'objectif de mise à jour de l'image

Answer 2

Peut-être que ce n'est pas la faute de React, envoyez-moi s'il vous plaît le code sur la façon de traiter les images

Answer 3

Ajoutez une clé à <img />, puis renvoyez une clé différente dans le prochain render() du composant parent.

Remarque : Cela peut entraîner des changements importants dans l'opération de mise à jour des différences, tels qu'un démontage/montage qui n'était pas disponible auparavant, ou l'affichage sera considérablement plus lent.

---

Vous pouvez utiliser redux sans réagir-redux, à condition d'utiliser d'autres méthodes pour transmettre le magasin à tous les composants, comme l'utilisation d'accessoires ou de contexte.