2.12.3
рдореИрдХ, рдХреНрд░реЛрдо 61,
https://codepen.io/anon/pen/EvKmNO?editors=001
рдХреГрдкрдпрд╛ \ , \ рдФрд░ \ рддрддреНрд╡реЛрдВ рдкрд░ рдХреНрд▓рд┐рдХ рдХрд░рддреЗ рд╕рдордп рдХреЛрдбрдкреЗрди рдирдореВрдиреЗ рдореЗрдВ рд╡реНрдпрд╡рд╣рд╛рд░ рдХрд╛ рдирд┐рд░реАрдХреНрд╖рдг рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрдВрд╕реЛрд▓ рдХреЛ рджреЗрдЦреЗрдВ
рдЙрддреНрд╕рд░реНрдЬрд┐рдд рдШрдЯрдирд╛ рдХреА рд▓рдХреНрд╖реНрдп рд╕рдВрдкрддреНрддрд┐ рд╣рдореЗрд╢рд╛ рд╣реЛрдиреА рдЪрд╛рд╣рд┐рдП \
рдШрдЯрдирд╛ рдЕрдиреНрдп рддрддреНрд╡реЛрдВ (рдмрд╛рд▓ рддрддреНрд╡реЛрдВ) рдХреЗ рд▓рд┐рдП рдирд┐рд░реНрдзрд╛рд░рд┐рдд рд▓рдХреНрд╖реНрдп рдХреЗ рд╕рд╛рде рд╢реБрд░реВ рд╣реЛрддреА рд╣реИ
рдмрдЯрди рдореЗрдВ рдЯреЗрдХреНрд╕реНрдЯ рдФрд░ / рдпрд╛ рдЖрдЗрдХрди рдкрд░ рдХреНрд▓рд┐рдХ рдХрд░рдиреЗ рд╕реЗ рдИрд╡реЗрдВрдЯ рдХреА рд▓рдХреНрд╖рд┐рдд рд╕рдВрдкрддреНрддрд┐ рддрддреНрд╡ рдХреЗ рдмрдЬрд╛рдп \ рдпрд╛ \ рддрддреНрд╡реЛрдВ рдореЗрдВ рдмрджрд▓ рдЬрд╛рддреА рд╣реИ
рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдПрдХ рдмрдЧ рд╣реИ... рдХреНрдпрд╛ рдЖрдк рдЗрд╕реЗ рдареАрдХ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╣рдореЗрдВ рдПрдХ рдкреАрдЖрд░ рджреЗ рд╕рдХрддреЗ рд╣реИрдВ?
рдЬрд╝рд░реВрд░, рдореИрдВ рдЗрд╕ рд╕рдкреНрддрд╛рд╣ рдПрдХ рдкреАрдЖрд░ рдмрдирд╛рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░реВрдБрдЧрд╛: +1:
@benjycui рдореБрдЭреЗ рд╕рдордЭ рдореЗрдВ рдирд╣реАрдВ рдЖрддрд╛ рдХрд┐ рдИрд╡реЗрдВрдЯ рд▓рдХреНрд╖реНрдп рд╣рдореЗрд╢рд╛ рдмрдЯрди рддрддреНрд╡ рдкрд░ рдХреНрдпреЛрдВ рд╕реЗрдЯ рдХрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдПред рдХрд┐рд╕реА рдИрд╡реЗрдВрдЯ рдХрд╛ рд▓рдХреНрд╖реНрдп рд╡рд╣ рддрддреНрд╡ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП рдЬрд╣рд╛рдВ рд╕реЗ рдИрд╡реЗрдВрдЯ рдЙрддреНрдкрдиреНрди рд╣реЛрддрд╛ рд╣реИред
@jddxf рдмрд┐рд▓реНрдХреБрд▓, рдЬрдм рдЖрдк <Button/>
рдкрд░ рдХреНрд▓рд┐рдХ рдХрд░рддреЗ рд╣реИрдВ рддреЛ рдЖрдк рдЙрдореНрдореАрдж рдХрд░рддреЗ рд╣реИрдВ рдХрд┐ рдпрд╣ рд▓рдХреНрд╖реНрдп рдХреЗ рд░реВрдк рдореЗрдВ рдкрд╛рд░рд┐рдд рд╣реЛ рдЬрд╛рдПрдЧрд╛, рднрд▓реЗ рд╣реА рдЖрдк <Button/>
рдХрд┐рд╕ рд╣рд┐рд╕реНрд╕реЗ рдкрд░ рдХреНрд▓рд┐рдХ рдХрд░реЗрдВред (рдпрд╣ рдореЙрдбреНрдпреВрд▓ рдФрд░ рдШрдЯрдХреЛрдВ рдХрд╛ рдкреВрд░рд╛ рд╡рд╛рджрд╛ рд╣реИ, рдЗрдирдкреБрдЯ рдХрд╛ рдПрдХ рд╕реЗрдЯ рдФрд░ рд▓рдЧрд╛рддрд╛рд░ рдЖрдЙрдЯрдкреБрдЯ рдХрд╛ рдПрдХ рд╕реЗрдЯ рд╣реИ)
рдЕрдм рдмрдЯрди рдШрдЯрдХ рдореЗрдВ <span/>
рдпрд╛ рд╣реБрдб рдХреЗ рдиреАрдЪреЗ рдХреЛрдИ рдЕрдиреНрдп рддрддреНрд╡ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ (рдЬреЛ рдкреНрд░рдпреЛрдЧ рдХрд░рдиреЗ рдпреЛрдЧреНрдп рднреА рдирд╣реАрдВ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдХреЛрдИ рдирд╣реАрдВ рдЬрд╛рдирддрд╛ рдХрд┐ рдпрд╣ рд╡рд╣рд╛рдВ рд╣реИ, рдпрд╣ рдХреЗрд╡рд▓ рд╣реБрдб рдХреЗ рдиреАрдЪреЗ рд╣реИ), рдпреЗ рддрддреНрд╡ рд░реИрдкрд░ рд╣реЛ рд╕рдХрддреЗ рд╣реИрдВ, рдЕрджреГрд╢реНрдп рдпрд╛ рдПрдХреАрдХреГрдд рд╣реЛ рд╕рдХрддреЗ рд╣реИрдВ <Button/>
ред рдЕрдм рдПрдХ рд╣реА рдмрдЯрди рдмрд░реНрддрд╛рд╡ рдХрд░рддрд╛ рд╣реИ рдкрд░ рдЕрд▓рдЧ рдврдВрдЧ рд╕реЗ рд╣рд░ рдмрд╛рд░ рдХреНрд▓рд┐рдХ рдХрд░рдиреЗ рдХрд▓реНрдкрдирд╛, рд╕рд┐рд░реНрдл рдЗрд╕рд▓рд┐рдП рдХрд┐ рдХреБрдЫ рд╕рдордп рдЖрдкрдХреЗ рджреНрд╡рд╛рд░рд╛ рдХреНрд▓рд┐рдХ рдЕрджреГрд╢реНрдп span
рдЕрдВрджрд░ Button
рдФрд░ рдкрд░ рдХреБрдЫ рд╕рдордп Button
рд╣реА рд╣реИ, рдХреЗ рд▓рд┐рдП рдХрд┐ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рд╕реБрд╕рдВрдЧрдд рдпрд╛ рд╡рд╛рдВрдЫрд┐рдд рдирд╣реАрдВ рд╣реИред
рддреЛ рдЖрдкрдХреЗ рдмрд┐рдВрджреБ рдкрд░, рдШрдЯрдирд╛ рд▓рдХреНрд╖реНрдп рд╣рдореЗрд╢рд╛ рдмрдЯрди рдкрд░ рд╕реЗрдЯ рдХрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП, рдЬрдм Button
рддрддреНрд╡ рдкрд░ рдХреНрд▓рд┐рдХ рдХрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛ (рдЙрдк-рдШрдЯрдХреЛрдВ рдФрд░ рддрддреНрд╡реЛрдВ рдХреЛ рдХреНрд▓рд┐рдХ-рдереНрд░реВ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП)
@ рдорд┐рдо-рдЖрд░реНрдордВрдб рдЖрдкрдХреА рдмрд╛рдд рд╕рдордЭ рдЧрдПред рдЖрдИрдПрдордУ, рдпрджрд┐ рдЖрдк рдШрдЯрдХ-рд╕реНрддрд░реАрдп рд╕реНрдерд┐рд░рддрд╛ рдкреНрд░рджрд╛рди рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ рддреЛ рдХреЙрд▓рдмреИрдХ рдореЗрдВ рддрд░реНрдХ рдХреЗ рд░реВрдк рдореЗрдВ Button
рдЙрджрд╛рд╣рд░рдг рдкреНрд░рджрд╛рди рдХрд░рдирд╛ рдмреЗрд╣рддрд░ рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдпрджрд┐ рддрд░реНрдХ Event
(рдпрд╛ рдЕрдзрд┐рдХ рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ React.SyntheticEvent
) рдЙрджрд╛рд╣рд░рдг рд╣реИ, рддреЛ рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЗрд╕рдХрд╛ рд▓рдХреНрд╖реНрдп рд╡рд╛рд╕реНрддрд╡рд┐рдХ рдШрдЯрдирд╛ рд▓рдХреНрд╖реНрдп рд╣реИ, рдЬреЛ рдбреЛрдо-рд╕реНрддрд░реАрдп рд╕реНрдерд┐рд░рддрд╛ рдкреНрд░рджрд╛рди рдХрд░рддрд╛ рд╣реИред
рдПрдХ рд╕рд╛рдЗрдб рдиреЛрдЯ рдХреЗ рд░реВрдк рдореЗрдВ, рдЖрдк рд╣рдореЗрд╢рд╛ button
рдХреЛ event.currentTarget
рд╕рд╛рде рд╕рдВрджрд░реНрднрд┐рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред
рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА
@ рдорд┐рдо-рдЖрд░реНрдордВрдб рдЖрдкрдХреА рдмрд╛рдд рд╕рдордЭ рдЧрдПред рдЖрдИрдПрдордУ, рдпрджрд┐ рдЖрдк рдШрдЯрдХ-рд╕реНрддрд░реАрдп рд╕реНрдерд┐рд░рддрд╛ рдкреНрд░рджрд╛рди рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ рддреЛ рдХреЙрд▓рдмреИрдХ рдореЗрдВ рддрд░реНрдХ рдХреЗ рд░реВрдк рдореЗрдВ
Button
рдЙрджрд╛рд╣рд░рдг рдкреНрд░рджрд╛рди рдХрд░рдирд╛ рдмреЗрд╣рддрд░ рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдпрджрд┐ рддрд░реНрдХEvent
(рдпрд╛ рдЕрдзрд┐рдХ рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗReact.SyntheticEvent
) рдЙрджрд╛рд╣рд░рдг рд╣реИ, рддреЛ рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЗрд╕рдХрд╛ рд▓рдХреНрд╖реНрдп рд╡рд╛рд╕реНрддрд╡рд┐рдХ рдШрдЯрдирд╛ рд▓рдХреНрд╖реНрдп рд╣реИ, рдЬреЛ рдбреЛрдо-рд╕реНрддрд░реАрдп рд╕реНрдерд┐рд░рддрд╛ рдкреНрд░рджрд╛рди рдХрд░рддрд╛ рд╣реИредрдПрдХ рд╕рд╛рдЗрдб рдиреЛрдЯ рдХреЗ рд░реВрдк рдореЗрдВ, рдЖрдк рд╣рдореЗрд╢рд╛
button
рдХреЛevent.currentTarget
рд╕рд╛рде рд╕рдВрджрд░реНрднрд┐рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред