Ant-design: Child elements inside the <Button /> should be click-through

Created on 31 Jul 2017  ·  5Comments  ·  Source: ant-design/ant-design

Version

2.12.3

Environment

MAC, Chrome 61,

Reproduction link

https://codepen.io/anon/pen/EvKmNO?editors=001

Steps to reproduce

Please looks at the console to inspect the behavior in the Codepen sample while clicking on the \

help wanted

Most helpful comment

@mim-Armand Got your point. IMO, it may be better to provide a Button instance as an argument in the callback if you'd like to offer component-level consistency. If the argument is an Event(or more specifically React.SyntheticEvent) instance, I suppose its target being the real event target, which offers dom-level consistency.
As a side note, you can always refer to the button with event.currentTarget.

All 5 comments

I think it's a bug... Could you give us a PR to fix it?

Sure, I will try to make a PR this week :+1:

@benjycui I don't quite understand why the event target should always be set to the button element. The target of an event should be the element where the event originates.

@jddxf exactly, when you click on a <Button/> you expect it to be passed as the target, regardless on which part of the <Button/> you click on. ( that's teh whole promise of modules and components, a set of inputs and a set of consistent out-puts )
Now the Button component may have a <span/> or another element under the hood ( Which is not even usable as nobody knows it's there, it's litterally just under the hood ), these elements may be wrappers, may be invisible or integrated in the <Button/>. now imagine clicking on the same Button behaves differently each time, only because some times you clicked on the invisible span inside the Button and some times on the Button itself, that for sure is not consistent or desired.
So to your point, imo the event target should always be set to the button, when the Button element was clicked ( sub-components and elements should be click-through )

@mim-Armand Got your point. IMO, it may be better to provide a Button instance as an argument in the callback if you'd like to offer component-level consistency. If the argument is an Event(or more specifically React.SyntheticEvent) instance, I suppose its target being the real event target, which offers dom-level consistency.
As a side note, you can always refer to the button with event.currentTarget.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

lifeneedspassion picture lifeneedspassion  ·  3Comments

Orbyt picture Orbyt  ·  3Comments

longhuasishen picture longhuasishen  ·  3Comments

zhangchen2397 picture zhangchen2397  ·  3Comments

PeteAndersen picture PeteAndersen  ·  3Comments
bleepcoder.com uses publicly licensed GitHub information to provide developers around the world with solutions to their problems. We are not affiliated with GitHub, Inc. or with any developers who use GitHub for their projects. We do not host any of the videos or images on our servers. All rights belong to their respective owners.
Source for this page: Source

Popular programming languages
Popular GitHub projects
More GitHub projects

© 2024 bleepcoder.com - Contact
Made with in the Dominican Republic.
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.