I have a generic react component which is passed a prop value, based on this prop value I would sometimes like this component to have a tabIndex of 0 and other times I wouldn’t.
If I assign it a value of 0 when it’s needed, what could the alternative be when it’s not needed? I’d basically like equivalent value as if the tabIndex prop wasn’t present i.e. has no effect.
Answers:
Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.
Method 1
tabindex="-1" means it is still programatically focusable (with .focus() for example) but will not interfere with the tab order / focus order of the page. For clarity tabindex="-1" means the only way to focus the item is if you target it via JavaScript.
If you want you can just add and remove the attribute as you need it, but this would probably be unnecessary in most scenarios.
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0