Bagaimana untuk Menetapkan Fokus Medan Input dalam React?

Menetapkan Fokus Medan Input dalam React

Apabila menguruskan interaksi pengguna dalam aplikasi React, selalunya perlu untuk mengarahkan tumpuan mereka kepada medan input tertentu selepas rendering halaman. Persoalan timbul mengenai cara terbaik untuk mencapai ini.

Dokumentasi untuk React mengesyorkan menggunakan rujukan: Untuk berbuat demikian, lampirkan atribut rujukan pada medan input, seperti "nameInput," dalam fungsi pemaparan. Selepas itu, anda boleh memanggil kaedah, "this.refs.nameInput.getInputDOMNode().focus();" untuk membawa medan input menjadi fokus.

Walau bagaimanapun, kaedah ini memperkenalkan persoalan di mana hendak meletakkan panggilan ini. Respons Dhiraj menyediakan penyelesaian yang berdaya maju: meletakkan panggilan fokus dalam komponen kaedah kitaran hayat ReactDidMount().

Sebagai alternatif, untuk kemudahan penggunaan, anda boleh memanfaatkan prop autoFokus untuk membawa input ke dalam fokus secara automatik apabila ia dipasang:

/>

Perhatikan bahawa dalam JSX, prop autoFokus ditulis dengan huruf besar F, tidak seperti dalam HTML biasa, di mana ia berada tidak sensitif huruf besar kecil.

Atas ialah kandungan terperinci Bagaimana untuk Menetapkan Fokus Medan Input dalam React?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!