Rumah > Soal Jawab > teks badan
P粉8100506692023-09-02 12:43:37
Mengapa anda tidak boleh memanggil cangkuk di dalam cangkuk - pergi ke sini untuk menyelam yang sangat mendalam dengan lebih banyak konteks daripada yang perlu saya berikan dalam jawapan ini https://overreacted.io/why-do-hooks-rely-on -call-order/
Penyelesaian anda berfungsi kerana walaupun "melanggar peraturan" susunan panggilan ke cangkuk sentiasa sama...sehingga pengguna ditambah atau dialih keluar dari keadaan.
Anda pasti boleh menggunakan penyelesaian yang anda tulis. Tetapi bagaimana jika anda perlu menukar bilangan pengguna?
Tidak, anda tidak boleh menggunakan cangkuk di dalam cangkuk. Ia mungkin "berfungsi", tetapi React memberitahu anda bahawa ia tidak berfungsi dengan pasti dan anda melakukannya dengan salah. Cangkuk mesti dipanggil di peringkat atas komponen peringkat atas cangkuk tersuai.
Anda berada di arah yang betul, tetapi penyelesaian kepada masalah adalah
div
untuk memberitahu anda elemen pengguna yang telah diklik. Ia kelihatan seperti ini:
function Application() { const [users, setUsers] = React.useState([ { id: 1, name: 'John Doe #1' }, { id: 2, name: 'John Doe #2' }, { id: 3, name: 'John Doe #3' }, ]); const [selectedUserId, setSelectedUserId] = React.useState(null); // this callback is referentially stable - it doesn't change between renders because it has no dependencies const handleSelectUser = React.useCallback((e) => { setSelectedUserId(+e.target.getAttribute('data-userid')); }, []); return users.map((user) => { const isSelected = selectedUserId === user.id; return ( <User {...user} data-userid={user.id} <- this line key={user.id} isSelected={isSelected} onClick={handleSelectUser} /> ); }); }