λꡬλ μ§ Chromeμμ λλκ·Έ μμ μ μμν λ μΌμμ μΌλ‘ λνλλ λ Ήμ λνκΈ° κΈ°νΈλ₯Ό μ κ±°νλ λ°©λ²μ μμ λμ΅λκΉ?
+1
Macμ Chrome 49 λλ Windowsμ Chrome 49μμμ΄ λ¬Έμ λ₯Ό μ¬ν ν μ μμ΅λλ€. http://gaearon.github.io/react-dnd/examples-drag-around-naive.html
μμ§λ μ΄λ° μΌμ΄ μΌμ΄λκ³ μμ΅λκΉ? μ¬μ©μ€μΈ Chrome λ²μ κ³Ό OSλ 무μμ λκΉ?
λν http://gaearon.github.io/react-dnd/examples-customize-drop-effects.htmlμ μ€λͺ λλλ‘ μ»€μ λμμ μ μ΄ ν μ
Macμ Chrome 49 (μ¬μ ν 10.10)μμ λͺ¨λ μμ μμ λ¬Έμ κ° λ°μν©λλ€. λλκ·Έ μμμ 컀μκ° λ
Ήμ λνκΈ° κΈ°νΈ (μΌλ°μ μΌλ‘ cursor: copy
νμλ¨)λ‘ λ³κ²½λ©λλ€. κ·Έλ¬λ©΄ "μ΄λ"컀μκ°λ©λλ€.
@globexdesigns (Chrome 49, OSX 10.11)λ₯Ό μ°κ²° ν μμ μμμ΄ λ¬Έμ λ₯Ό μ°λ°μ μΌλ‘ μ¬ν ν μ μμ΅λλ€. μμλλ‘ μλνκΈ° μ μ
μ μκ°μλ Reactμ μΌκ΄ λ λλ§μ£ΌκΈ°μ λΈλΌμ°μ μ dnd ꡬν (μ΄ κ²½μ° μμ ν μ μμ) μ¬μ΄μ 짧μ μ§μ°μ΄κ±°λ Chromeμ λ²κ·Έμ λλ€. λλ λ€λ₯Έ λΈλΌμ°μ (λκ΅°κ° λλ₯Ό μ΄κΈ°μ§ μλ ν)λ₯Ό κ°μ§κ³ λλ©΄μ κ±°κΈ°μμ μ¬νμ μ»μ μ μλμ§ λ³Ό κ²μ΄λ€.
Chrome 49 OSX 10.11.4μμλ λκ°μ νμμ΄ λνλ©λλ€. μ μ ν μ μμΌλ‘ λμκ°λλ€. Safari λλ Firefoxμμλμ΄ λ¬Έμ κ° λ°μνμ§ μμ΅λλ€.
@EvNaverniouk μ λ Chrome 49 λ° OS X 10.11.4λ₯Ό μ¬μ© μ€μ΄κ³ μ, μ¬μ ν λ¬Έμ κ° νμλλ©° μ, http://gaearon.github.io/react λ₯Ό μ°Έμ‘°νμ΄ λ§ν¬μμ μμ ν λ λ³΅μ¬ λ³΅μ¬ μμ΄μ½μ΄ νμλ©λλ€.
OS X 10.11.2μ Chrome 50μμλμ΄ λ¬Έμ κ° λνλ©λλ€.
OS X 10.10.1μμμ΄ Chrome 51λ λ³Ό μ μμ΅λλ€.
OSX 10.11.4μ Chrome λ²μ 51μμλμ΄ νμμ΄ λνλ©λλ€.
νΈμ§ : λλκ·Έ λ μ΄μ΄λ₯Ό ꡬννκ³ connectDragPreview λ° getEmptyImage ()λ₯Ό μ¬μ©νμ¬ μ½λλ₯Ό μ¬λ°λ₯΄κ² ν¬ν¨νλ κΈ°λ₯μ μΆκ° ν ν λ¬Έμ κ° ν΄κ²° λ κ² κ°μ΅λλ€.
λλ μ΄κ²μ React DnDμ λ€λ₯Έ λΌμ΄λΈλ¬λ¦¬μμ 무μμλ‘ λ³΄μκ³ μ¬μ§μ΄ μμ HTML5 λλκ·Έ κ°λ₯ν©λλ€. λ΄ μκ° μ κ·Έκ²μ dragstartμμ effectAllowed
λ₯Ό μ€μ νμ§ μλ κ²κ³Ό κ΄λ ¨μ΄ μμ΅λλ€.
μ΄κ²μ λν μ λ°μ΄νΈκ° μμ΅λκΉ? Chrome 53 OSX 10.10.5μμ λμΌν λ¬Έμ μ μ§λ©΄
Chrome 54.0.2840.71 10.11.6κ³Ό λμΌν λ΄μ©μ΄ νμλλ©° μ λ°μ΄νΈκ° μμ΅λκΉ?
+1
{dropEffect: 'copy'}
μ¬μ©νλ©΄ λ¬Έμ κ° κ°λ €μ§λλ€ (λ
Ήμκ³Ό νμ 보μ΄κ² ν¨). νμ§λ§ μ λλ‘ μμ νμ§ μμ΅λλ€.
λν {dropEffect: 'move'}
컀μκ° 4 μ μμμ μΌλ‘ μ±κ³΅μ μΌλ‘ λ§λ€μ΄μ§μ§ μλ κ² κ°μ΅λλ€.
Chrome λ²μ : 55.0.2883.95 (곡μ λΉλ) (64 λΉνΈ)
μ΄ λΌμ΄λΈλ¬λ¦¬μ κΈ°λ₯μ΄ μλ κ² κ°μμ΄ λ¬Έμ λ₯Ό λ§λ¬΄λ¦¬ν©λλ€.
@fredguestμ λν ν΄κ²°μ± μ μ°Ύμ μ μ΄ μμ΅λκΉ?
@Yamikamisama μ¬νκ²λ μλ.
λ΄ canDrop ν¨μκ° falseλ₯Ό λ°ν ν λκΉμ§ λ Ήμ λνκΈ° λ²νΌμ΄ νμλμ§ μκ³ λνλ©λλ€.
event.dataTransfer.dropEffect = 'none'
event.dataTransfer.effectAllowed = 'none'
μ΄κ²μ ν¬λ‘¬μμ λλ₯Ό μν΄ μΌνμ΅λλ€. dataTransfer κ°μ²΄μ μ‘μΈμ€ ν μμλ μ μΌν μ΄λ²€νΈμ΄λ―λ‘ "dragstart"λ° "dragend"μ΄λ²€νΈμ λ£μΌμμμ€.
μ΄κ²μ λλ₯Ό λμ§ μμλ€
event.dataTransfer.dropEffect = 'none'
event.dataTransfer.effectAllowed = 'none'
cursor: 'grab'
μμ cursor: 'grabbing'
μ¬μ΄μ μ μ λμ λ§ λ°μν©λλ€.
λΆννλ gif νμμΌλ‘ νμλμ§ μμ§λ§ gif μλμ κ·Έλ¦Όμ λ¬Έμ λ₯Ό 보μ¬μ€λλ€.
μ΄ λ¬Έμ λ λ°μνκ³ μμ΅λλ€. Chromeμ λ²κ·Έμ²λΌ 보μ λλ€.
+1
+1 ν¬λ‘¬ λ²μ 84.0.4147.89
νΈμ§ : μ΄κ²μ 미리보기 μ΄λ―Έμ§κ°μλ λ€μ μ½λλ₯Ό μ¬μ©ν λλ§ λ°μν©λλ€.
useEffect(() => {
preview(getEmptyImage(), { captureDraggingState: true });
}, [preview]);
미리보기λ₯Ό ꡬννλ©΄μ΄ λ¬Έμ κ° ν΄κ²°λ©λλ€.
κ°μ₯ μ μ©ν λκΈ
μ΄κ²μ ν¬λ‘¬μμ λλ₯Ό μν΄ μΌνμ΅λλ€. dataTransfer κ°μ²΄μ μ‘μΈμ€ ν μμλ μ μΌν μ΄λ²€νΈμ΄λ―λ‘ "dragstart"λ° "dragend"μ΄λ²€νΈμ λ£μΌμμμ€.