React-dnd: Π’ΠΈΠΏ принятия useDrop DropTargetHookSpec Π΄ΠΎΠ»ΠΆΠ΅Π½ Π²ΠΊΠ»ΡŽΡ‡Π°Ρ‚ΡŒ Ρ‚ΠΈΠΏ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ

Π‘ΠΎΠ·Π΄Π°Π½Π½Ρ‹ΠΉ Π½Π° 20 Π°Π²Π³. 2020  Β·  3ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ  Β·  Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ: react-dnd/react-dnd

ΠžΠΏΠΈΡˆΠΈΡ‚Π΅ ΠΎΡˆΠΈΠ±ΠΊΡƒ
Π’ вашСй Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°Ρ†ΠΈΠΈ useDrop говорится, Ρ‡Ρ‚ΠΎ Ρ‡Π»Π΅Π½ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Π° спСцификации accept прСдставляСт собой «строку, символ ES6, массив любого ΠΈΠ· Π½ΠΈΡ… ΠΈΠ»ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, которая Π²ΠΎΠ·Π²Ρ€Π°Ρ‰Π°Π΅Ρ‚ любой ΠΈΠ· Π½ΠΈΡ…, учитывая Ρ€Π΅ΠΊΠ²ΠΈΠ·ΠΈΡ‚Ρ‹ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π°Β».
Но Π² ΠΊΠΎΠ΄Π΅ accept опрСдСляСтся ΠΊΠ°ΠΊ TargetType , Ρ‡Ρ‚ΠΎ Ρ€Π°Π²Π½ΠΎ string | symbol ΠΈΠ»ΠΈ ΠΈΡ… массиву.

ОТидаСмоС повСдСниС
accept Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ Ρ‚ΠΈΠΏΠΎΠΌ, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½Π° функция, Π²ΠΎΠ·Π²Ρ€Π°Ρ‰Π°ΡŽΡ‰Π°Ρ TargetType .

Π”ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ контСкст
Π― Ρ…ΠΎΡ‡Ρƒ динамичСски ΠΎΠ±Π½ΠΎΠ²Π»ΡΡ‚ΡŒ accept . Π― Π΄ΡƒΠΌΠ°Π», Ρ‡Ρ‚ΠΎ это Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ² Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ accept для useDrop , Π½ΠΎ это Π½Π΅ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚. Π’ настоящСС врСмя я Π½Π΅ Π²ΠΈΠΆΡƒ, ΠΊΠ°ΠΊ это ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΈΠ½Π°Ρ‡Π΅, ΠΈ я Π½Π΅ ΠΌΠΎΠ³Ρƒ Π½Π°ΠΉΡ‚ΠΈ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅, описанноС Π² Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°Ρ†ΠΈΠΈ.

Π‘Π°ΠΌΡ‹ΠΉ ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π― знаю, Ρ‡Ρ‚ΠΎ это Π½Π΅ идСальноС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅, Π½ΠΎ ΠΏΠΎΠΊΠ° это Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π΅ΡˆΠ΅Π½ΠΎ ΠΈ Ρƒ нас Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ†Π΅Π»Π΅Π²Ρ‹Ρ… Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ создания Ρ‚ΠΈΠΏΠΎΠ², ΠΎΠ±Ρ…ΠΎΠ΄Π½Ρ‹ΠΌ ΠΏΡƒΡ‚Π΅ΠΌ Π±ΡƒΠ΄Π΅Ρ‚ использованиС свойства key , Ρ€Π°Π²Π½ΠΎΠ³ΠΎ вашим принятым Ρ‚ΠΈΠΏΠ°ΠΌ, Π² ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π΅, содСрТащСм ваш ΡΠ±Ρ€ΠΎΡΠΈΡ‚ΡŒ Ρ†Π΅Π»ΡŒ. Π­Ρ‚ΠΎ обСспСчит Π΅Π³ΠΎ ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎΠ΅ ΠΌΠΎΠ½Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ допустимый Ρ‚ΠΈΠΏ (Ρ‚ΠΈΠΏΡ‹). Π― Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‡Ρ‚ΠΎ столкнулся с этой Ρ‚ΠΎΡ‡Π½ΠΎΠΉ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠΎΠΉ сСгодня.

ВсС 3 ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π― знаю, Ρ‡Ρ‚ΠΎ это Π½Π΅ идСальноС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅, Π½ΠΎ ΠΏΠΎΠΊΠ° это Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π΅ΡˆΠ΅Π½ΠΎ ΠΈ Ρƒ нас Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ†Π΅Π»Π΅Π²Ρ‹Ρ… Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ создания Ρ‚ΠΈΠΏΠΎΠ², ΠΎΠ±Ρ…ΠΎΠ΄Π½Ρ‹ΠΌ ΠΏΡƒΡ‚Π΅ΠΌ Π±ΡƒΠ΄Π΅Ρ‚ использованиС свойства key , Ρ€Π°Π²Π½ΠΎΠ³ΠΎ вашим принятым Ρ‚ΠΈΠΏΠ°ΠΌ, Π² ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π΅, содСрТащСм ваш ΡΠ±Ρ€ΠΎΡΠΈΡ‚ΡŒ Ρ†Π΅Π»ΡŒ. Π­Ρ‚ΠΎ обСспСчит Π΅Π³ΠΎ ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎΠ΅ ΠΌΠΎΠ½Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ допустимый Ρ‚ΠΈΠΏ (Ρ‚ΠΈΠΏΡ‹). Π― Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‡Ρ‚ΠΎ столкнулся с этой Ρ‚ΠΎΡ‡Π½ΠΎΠΉ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠΎΠΉ сСгодня.

Π― Ρ‚ΠΎΠΆΠ΅ это Π·Π°ΠΌΠ΅Ρ‚ΠΈΠ», Π½ΠΎ обошСл это с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ canDrop .

Π― знаю, Ρ‡Ρ‚ΠΎ это Π½Π΅ идСальноС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅, Π½ΠΎ ΠΏΠΎΠΊΠ° это Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π΅ΡˆΠ΅Π½ΠΎ ΠΈ Ρƒ нас Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ†Π΅Π»Π΅Π²Ρ‹Ρ… Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ создания Ρ‚ΠΈΠΏΠΎΠ², ΠΎΠ±Ρ…ΠΎΠ΄Π½Ρ‹ΠΌ ΠΏΡƒΡ‚Π΅ΠΌ Π±ΡƒΠ΄Π΅Ρ‚ использованиС свойства key , Ρ€Π°Π²Π½ΠΎΠ³ΠΎ вашим принятым Ρ‚ΠΈΠΏΠ°ΠΌ, Π² ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π΅, содСрТащСм ваш ΡΠ±Ρ€ΠΎΡΠΈΡ‚ΡŒ Ρ†Π΅Π»ΡŒ. Π­Ρ‚ΠΎ обСспСчит Π΅Π³ΠΎ ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎΠ΅ ΠΌΠΎΠ½Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ допустимый Ρ‚ΠΈΠΏ (Ρ‚ΠΈΠΏΡ‹). Π― Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‡Ρ‚ΠΎ столкнулся с этой Ρ‚ΠΎΡ‡Π½ΠΎΠΉ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠΎΠΉ сСгодня.

ΠŸΡ€ΠΎΡΡ‚ΠΎ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡŽ этот ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ: Ρƒ мСня Π±Ρ‹Π»Π° ситуация, ΠΊΠΎΠ³Π΄Π° Ρƒ мСня Π±Ρ‹Π» Ρ‚Π΅Ρ€Π½Π΅Ρ€, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π» Π΄Π²Π΅ вСрсии ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΈ Ρ‚ΠΎΠ³ΠΎ ΠΆΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π° Π½Π° основС логичСского значСния. Компания Clever React поняла, Ρ‡Ρ‚ΠΎ это ΠΎΠ΄ΠΈΠ½ ΠΈ Ρ‚ΠΎΡ‚ ΠΆΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚, Π½ΠΎ с Ρ€Π°Π·Π½Ρ‹ΠΌΠΈ Ρ€Π΅ΠΊΠ²ΠΈΠ·ΠΈΡ‚Π°ΠΌΠΈ. Π₯отя я пытался ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ этот Ρ‚Ρ€ΠΎΠΈΡ‡Π½Ρ‹ΠΉ ΠΊΠΎΠ΄ для Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° ΠΈΡ… ΠΊΠ°ΠΊ нСзависимых ΡƒΠ·Π»ΠΎΠ², ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΠΎΠ½Ρ‚ΠΈΡ€ΡƒΡŽΡ‚ΡΡ/Ρ€Π°Π·ΠΌΠΎΠ½Ρ‚ΠΈΡ€ΡƒΡŽΡ‚ΡΡ Π½Π° основС логичСского значСния, Π½Π° самом Π΄Π΅Π»Π΅ это Π±Ρ‹Π» ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½Ρ‹ΠΉ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³ вмСсто ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎΠ³ΠΎ монтирования. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, accept Π±Ρ‹Π» основан Π½Π° исходных Ρ€Π΅ΠΊΠ²ΠΈΠ·ΠΈΡ‚Π°Ρ…, Π° Π½Π΅ Π½Π° Π½ΠΎΠ²Ρ‹Ρ…, ΠΈ useDrop Π½Π΅ обновляСтся Π½Π° основС измСнСния этого Ρ€Π΅ΠΊΠ²ΠΈΠ·ΠΈΡ‚Π°.

Π‘Ρ‹Π»Π° Π»ΠΈ эта страница ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ?
0 / 5 - 0 Ρ€Π΅ΠΉΡ‚ΠΈΠ½Π³ΠΈ