Bagaimana untuk Menetapkan Fokus pada Medan Input dalam Reaksi Selepas Pemberian?

Menetapkan Fokus pada Medan Input Pasca-Rendering dalam React

Menetapkan fokus pada medan input tertentu selepas pemaparan komponen boleh dicapai melalui React's sistem ref. Dengan memberikan rujukan kepada medan input menggunakan atribut "ref", anda mendapat akses kepada nod DOMnya, membolehkan anda memanipulasi keadaan fokusnya.

Seperti yang dinyatakan dalam dokumentasi, anda boleh menetapkan ref bernama " nameInput" ke medan input anda semasa fungsi render. Walau bagaimanapun, persoalan kritikalnya ialah: di manakah anda harus memanggil kaedah "fokus()"?

Titik Invokasi Optimum

Untuk hasil yang optimum, anda harus memanggil "ini .refs.nameInput.getInputDOMNode().focus()" kaedah dalam kaedah kitaran hayat "componentDidMount". Kaedah ini digunakan serta-merta selepas komponen dipasang dan dimasukkan ke dalam DOM. Dengan memanggil kaedah fokus di sini, anda memastikan bahawa fokus ditetapkan sebaik sahaja komponen kelihatan.

Pilihan Alternatif

Penyelesaian @Dhiraj menawarkan pendekatan alternatif dengan menggunakan prop "autoFocus". Prop ini, apabila ditetapkan kepada benar, mengarahkan medan input untuk memfokus secara automatik apabila ia dipasang. Anda boleh menggunakannya seperti ini:

<input autoFocus name=... />

Perhatikan bahawa "autoFocus" hendaklah menggunakan huruf besar "autoFocus" dalam JSX, tidak seperti HTML, yang tidak peka huruf besar-kecil.

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