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

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>

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>

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!