Mengapa React Melemparkan Ralat 'Tidak Dapat Membaca Harta 'setState' Undefined'?

Mary-Kate Olsen
Lepaskan: 2024-11-05 06:28:01
asal
405 orang telah melayarinya

Why Does React Throw a

Memahami Ralat "Cannot Read Property 'setState' of Undefined" dalam React

Apabila bekerja dengan komponen React, anda mungkin menghadapi "Cannot read property 'setState' ralat yang tidak ditentukan". Isu ini timbul apabila cuba mengakses kaedah setState dalam kaedah komponen React, tetapi kaedah itu tidak terikat dengan betul pada contoh komponen.

Atasi Isu Pengikat

Dalam yang disediakan contoh, ralat ini berlaku dalam kaedah delta(). Sebab untuk ini ialah this.delta tidak terikat pada contoh komponen Kaunter. Untuk menyelesaikan masalah ini, gunakan kod berikut dalam pembina:

<code class="javascript">this.delta = this.delta.bind(this);</code>
Salin selepas log masuk

Mengikat kaedah delta kepada contoh komponen memastikan ia mempunyai akses kepada konteks komponen ini, yang membolehkannya mengakses kaedah setState dan keadaan komponen.

Kod Kemas Kini

Versi kod yang diperbetulkan sepatutnya kelihatan seperti ini:

<code class="javascript">class Counter extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            count: 1,
        };

        this.delta = this.delta.bind(this); // Bind 'delta' to the component instance
    }

    delta() {
        this.setState({
            count: this.state.count++,
        });
    }

    render() {
        return (
            <div>
                <h1>{this.state.count}</h1>
                <button onClick={this.delta}>+</button>
            </div>
        );
    }
}</code>
Salin selepas log masuk

Dengan mengikat kaedah delta, anda berjaya menyelesaikan " Tidak dapat membaca ralat 'setState' of undefined" dan membolehkan komponen menambah kiraan seperti yang dijangkakan.

Atas ialah kandungan terperinci Mengapa React Melemparkan Ralat 'Tidak Dapat Membaca Harta 'setState' Undefined'?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!