javascript - Bagaimana untuk memaksa komponen untuk menyegarkan semula dalam tindak balas?

Question

Terdapat teg <img src='127.0.0.1/img' /> di dalam komponen untuk memuatkan imej melalui url Diandaikan bahawa imej serba putih pada mulanya dikembalikan
Selepas pengguna mengklik a butang, imej pemprosesan latar belakang menjadi hitam penuh.
Pada masa ini, saya berharap pelanggan dapat menyegarkan semula perubahan ini secara automatik dan gambar akan dipaparkan hitam sepenuhnya.
Perubahan keadaan nampaknya tidak menyebabkan permintaan lain untuk alamat 'src='127.0.0.1/img'.
Adakah ada cara untuk mencapai ini?
//-----------------
Tanya soalan lain. . Bolehkah bertindak balas digunakan dengan redux tanpa react-redux? Jika tidak digunakan, bagaimanakah kedai tersebut boleh diagihkan kepada setiap komponen?

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

Answer 1

Walaupun saya tidak tahu apa yang anda maksudkan, jika anda hanya mahu memuatkan semula imej selepas pengguna mengeditnya, anda boleh menetapkan bendera untuk menentukan sama ada imej telah dikendalikan dan kemudian gunakan setState untuk menukar bendera untuk mengemas kini imej Tujuan

.

Answer 2

Mungkin ia bukan kesalahan bertindak balas, sila hantarkan saya kod tentang cara memproses imej

Answer 3

Tambahkan kunci pada <img />, dan kemudian kembalikan kunci lain dalam render() komponen induk seterusnya.

Nota: Ini boleh menyebabkan perubahan ketara dalam operasi kemas kini perbezaan, seperti nyahlekap/lekap yang tidak tersedia sebelum ini, atau paparan akan menjadi lebih perlahan.

---

Anda boleh menggunakan redux tanpa react-redux, asalkan anda menggunakan kaedah lain untuk menghantar stor kepada semua komponen, seperti menggunakan prop atau konteks.