React-dnd: рдореЙрдбреНрдпреВрд▓ рдирд╣реАрдВ рдорд┐рд▓рд╛: 'D:\desktop\ant_design_pro\onefox\src\components\Drag' рдореЗрдВ './Constants' рдХреЛ рд╣рд▓ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛

рдХреЛ рдирд┐рд░реНрдорд┐рдд 2 рдЬреВрди 2018  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: react-dnd/react-dnd

рдмрдЧ рдХрд╛ рд╡рд░реНрдгрди рдХрд░реЗрдВ
рдмрдЧ рдХреНрдпрд╛ рд╣реИ рдЗрд╕рдХрд╛ рдПрдХ рд╕реНрдкрд╖реНрдЯ рдФрд░ рд╕рдВрдХреНрд╖рд┐рдкреНрдд рд╡рд┐рд╡рд░рдгред
рдореЙрдбреНрдпреВрд▓ рдирд╣реАрдВ рдорд┐рд▓рд╛: 'D:\desktop\ant_design_pro\onefox\src\components\Drag' рдореЗрдВ './Constants' рдХреЛ рд╣рд▓ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛
рдкреНрд░рдЬрдирди рдХрд░рдирд╛
рд╡реНрдпрд╡рд╣рд╛рд░ рдХреЛ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрджрдо:
'рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛' рд╕реЗ рдЖрдпрд╛рдд рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛, {рдШрдЯрдХ};
'рдкреНрд░реЛрдк-рдЯрд╛рдЗрдкреНрд╕' рд╕реЗ рдкреНрд░реЛрдкрдЯрд╛рдЗрдк рдЖрдпрд╛рдд рдХрд░реЗрдВ;
'react-dnd' рд╕реЗ {DragSource} рдЖрдпрд╛рдд рдХрд░реЗрдВ;
рдЖрдпрд╛рдд { ItemTypes } './Constants' рд╕реЗ;

рд╕реНрдерд┐рд░рд╛рдВрдХ рдХрд╣рд╛рдБ рд╣реИ? рдореИрдВ ItemTypes рдХреИрд╕реЗ рдЖрдпрд╛рдд рдХрд░ рд╕рдХрддрд╛ рд╣реВрдВ?
рдЕрдкреЗрдХреНрд╖рд┐рддреН рд╡реНрдпрд╡рд╣рд╛рд░
рдЖрдк рдЬреЛ рд╣реЛрдиреЗ рдХреА рдЙрдореНрдореАрдж рдХрд░ рд░рд╣реЗ рдереЗ рдЙрд╕рдХрд╛ рдПрдХ рд╕реНрдкрд╖реНрдЯ рдФрд░ рд╕рдВрдХреНрд╖рд┐рдкреНрдд рд╡рд┐рд╡рд░рдгред

рд╕реНрдХреНрд░реАрдирд╢реЙрдЯ
рдпрджрд┐ рд▓рд╛рдЧреВ рд╣реЛ, рддреЛ рдЕрдкрдиреА рд╕рдорд╕реНрдпрд╛ рд╕рдордЭрд╛рдиреЗ рдореЗрдВ рд╕рд╣рд╛рдпрддрд╛ рдХреЗ рд▓рд┐рдП рд╕реНрдХреНрд░реАрдирд╢реЙрдЯ рдЬреЛрдбрд╝реЗрдВред

рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХреНрд░реЛрдо

рдЕрддрд┐рд░рд┐рдХреНрдд рд╕рдВрджрд░реНрдн
рдпрд╣рд╛рдВ рд╕рдорд╕реНрдпрд╛ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреЛрдИ рдЕрдиреНрдп рд╕рдВрджрд░реНрдн рдЬреЛрдбрд╝реЗрдВред

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдбреАрдПрдирдбреА рдореЗрдВ, рдкреНрд░рддреНрдпреЗрдХ рдбреНрд░реИрдЧ рд╕реНрд░реЛрдд рдХрд╛ рдПрдХ рдкреНрд░рдХрд╛рд░ рд╣реЛрддрд╛ рд╣реИред рдФрд░ рдХрд┐рд╕ рдкреНрд░рдХрд╛рд░ рдХреЗ рд╣реИрдВ рдЗрд╕ рдкрд░ рдирд┐рд░реНрднрд░ рдХрд░рддреЗ рд╣реИрдВ рдХрд┐ рдЖрдк рдЕрдкрдиреЗ рдкреНрд░реЛрдЧреНрд░рд╛рдо рдореЗрдВ рдХреНрдпрд╛ рдЦреАрдВрдЪ рд░рд╣реЗ рд╣реИрдВред рддреЛ рдореЗрд░реЗ рдРрдк рдореЗрдВ рдореЗрд░реЗ рдкрд╛рд╕ "рдХрд╛рд░реНрдп" рдФрд░ "рдкреНрд░реЛрдЬреЗрдХреНрдЯ" рдкреНрд░рдХрд╛рд░ рд╣реИрдВ, рд▓реЗрдХрд┐рди рдЖрдкрдХреЗ рдкрд╛рд╕ "рд╕рдВрдкрд░реНрдХ" рдФрд░ "рд╕рдВрдЧрдарди" рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдпрджрд┐ рдЖрдк рдЗрди рд╕реНрдЯреНрд░рд┐рдВрдЧреНрд╕ рдХреЛ рд╣рд░ рд╕рдордп рдЯрд╛рдЗрдк рдирд╣реАрдВ рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ (рдЪреВрдВрдХрд┐ рдЖрдк рдереАрдо рдХреА рд╡рд░реНрддрдиреА рдЧрд▓рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ), рддреЛ рдЖрдк рдЙрди рд╕рднреА рдХреЛ рдПрдХ рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рд╕рдВрдЧреНрд░рд╣реАрдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ:

// Constants.js
export default {
  CONTACT: "contact",
  ORGANIZATION: "organization",
};

рдлрд┐рд░ рдЖрдкрдХреЗ рдЙрджрд╛рд╣рд░рдг рдореЗрдВ рдбреНрд░реИрдЧ/Contact.js рдЖрдк рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВрдЧреЗ:

import ItemTypes from "./Constants";

class Contact extends Component {
  ...
}

Contact = DragSource(ItemTypes.CONTACT, ...)(Contact);
export { Contact };

рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЖрдкрдХреА рд╕рдорд╕реНрдпрд╛ рдпрд╣ рд╣реИ рдХрд┐ рдЖрдкрдиреЗ рдХреЙрдиреНрд╕реНрдЯреЗрдВрдЯ.рдЬреЗрдПрд╕ рдлрд╝рд╛рдЗрд▓ рдирд╣реАрдВ рдмрдирд╛рдИ рд╣реИ рдпрд╛ рдпрд╣ рдЖрдкрдХреЗ рдкреАрд╕реА рдкрд░ рдбреНрд░реИрдЧ рдбрд╛рдпрд░реЗрдХреНрдЯрд░реА рдореЗрдВ рдирд╣реАрдВ рд╣реИ!

рд╕рднреА 3 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

@yaoyuande рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рд╕рдорд╕реНрдпрд╛ react-dnd рд╕реЗ рд╕рдВрдмрдВрдзрд┐рдд рдирд╣реАрдВ рд╣реИред

рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдбреАрдПрдирдбреА рдореЗрдВ, рдкреНрд░рддреНрдпреЗрдХ рдбреНрд░реИрдЧ рд╕реНрд░реЛрдд рдХрд╛ рдПрдХ рдкреНрд░рдХрд╛рд░ рд╣реЛрддрд╛ рд╣реИред рдФрд░ рдХрд┐рд╕ рдкреНрд░рдХрд╛рд░ рдХреЗ рд╣реИрдВ рдЗрд╕ рдкрд░ рдирд┐рд░реНрднрд░ рдХрд░рддреЗ рд╣реИрдВ рдХрд┐ рдЖрдк рдЕрдкрдиреЗ рдкреНрд░реЛрдЧреНрд░рд╛рдо рдореЗрдВ рдХреНрдпрд╛ рдЦреАрдВрдЪ рд░рд╣реЗ рд╣реИрдВред рддреЛ рдореЗрд░реЗ рдРрдк рдореЗрдВ рдореЗрд░реЗ рдкрд╛рд╕ "рдХрд╛рд░реНрдп" рдФрд░ "рдкреНрд░реЛрдЬреЗрдХреНрдЯ" рдкреНрд░рдХрд╛рд░ рд╣реИрдВ, рд▓реЗрдХрд┐рди рдЖрдкрдХреЗ рдкрд╛рд╕ "рд╕рдВрдкрд░реНрдХ" рдФрд░ "рд╕рдВрдЧрдарди" рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдпрджрд┐ рдЖрдк рдЗрди рд╕реНрдЯреНрд░рд┐рдВрдЧреНрд╕ рдХреЛ рд╣рд░ рд╕рдордп рдЯрд╛рдЗрдк рдирд╣реАрдВ рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ (рдЪреВрдВрдХрд┐ рдЖрдк рдереАрдо рдХреА рд╡рд░реНрддрдиреА рдЧрд▓рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ), рддреЛ рдЖрдк рдЙрди рд╕рднреА рдХреЛ рдПрдХ рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рд╕рдВрдЧреНрд░рд╣реАрдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ:

// Constants.js
export default {
  CONTACT: "contact",
  ORGANIZATION: "organization",
};

рдлрд┐рд░ рдЖрдкрдХреЗ рдЙрджрд╛рд╣рд░рдг рдореЗрдВ рдбреНрд░реИрдЧ/Contact.js рдЖрдк рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВрдЧреЗ:

import ItemTypes from "./Constants";

class Contact extends Component {
  ...
}

Contact = DragSource(ItemTypes.CONTACT, ...)(Contact);
export { Contact };

рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЖрдкрдХреА рд╕рдорд╕реНрдпрд╛ рдпрд╣ рд╣реИ рдХрд┐ рдЖрдкрдиреЗ рдХреЙрдиреНрд╕реНрдЯреЗрдВрдЯ.рдЬреЗрдПрд╕ рдлрд╝рд╛рдЗрд▓ рдирд╣реАрдВ рдмрдирд╛рдИ рд╣реИ рдпрд╛ рдпрд╣ рдЖрдкрдХреЗ рдкреАрд╕реА рдкрд░ рдбреНрд░реИрдЧ рдбрд╛рдпрд░реЗрдХреНрдЯрд░реА рдореЗрдВ рдирд╣реАрдВ рд╣реИ!

@amazingmarvin рдмрд╣реБрдд рдмрд╣реБрдд рдзрдиреНрдпрд╡рд╛рдж!

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

Vadorequest picture Vadorequest  ┬╖  4рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

mx2323 picture mx2323  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

antoineBernard picture antoineBernard  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

croraf picture croraf  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

Okami92 picture Okami92  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ