Saya mencoba mengubah status kelas dari komponen bernama yang diimpor jadi saya hanya perlu menulis kode sekali. Apakah ini mungkin?

Saya memiliki 3 file (Login, ForgotPassword, Daftar). Pada SEMUA file ini saya mendengarkan acara "onChange" di bidang input yang semuanya melakukan hal yang sama seperti yang ditunjukkan di bawah ini:

metode onChange:

onChange = (e) => {
    this.setState(() => ({ errors: {} }));

    let fields = this.state.fields;
    fields[e.target.name] = e.target.value;
    this.setState(() => {
        return {
            fields
        }
    });
};

Saya benar-benar ingin mengimpor ini sebagai metode bernama bersama dengan beberapa metode lain yang sudah berfungsi:

import { onFocus, onBlur, onChange } from './Utils/Input';

Masalahnya adalah (seperti yang terlihat di atas dalam kode onChange), bahwa saya perlu memperbarui status kelas dari metode ini.

Apakah ini mungkin? Saya sangat baru di React, jadi saya mungkin melakukan hal ini dengan cara yang salah.

Terima kasih sebelumnya!

0
1amShaw 29 Mei 2019, 19:51

2 jawaban

Jawaban Terbaik

Saat mencoba memperbarui status komponen, Anda selalu memperbarui status terkait hal ini.

Anda mencoba untuk menulis pada* fungsi yang tidak bergantung pada instance yang sedang Anda kerjakan. Jadi tidak masuk akal untuk menggunakan "ini" di dalamnya.

Anda dapat meneruskan instance Kelas ke fungsi aktif seperti ini:

https://codesandbox.io/s/focused-cache-zzfvp

1
tabulaR 29 Mei 2019, 17:12

Gunakan metode dengan mengikat konteksnya dari dalam kelas seperti ini

onChange.bind(this)

1
Shridhar Sharma 29 Mei 2019, 16:59