Skip to content

Enter keydown on items in SubMenu #92

Open
@lipedeitos

Description

@lipedeitos

Hi!

I'm wrapping some RC features like rc-menu inside my own componentes.
This is how I'm using them right now:

const menu = (
      <FFMenu onClick={(item) => { console.log(item.key); }}>
        <FFMenu.Item key="1" icon="person">Testando 1</FFMenu.Item>
        <FFMenu.Item key="2" icon="build">Testando 2</FFMenu.Item>
        <FFMenu.SubMenu key="3" icon="check" title="Testando 3">
          <FFMenu.Item key="3-1">Testando 3-1</FFMenu.Item>
          <FFMenu.Item key="3-2">Testando 3-2</FFMenu.Item>
          <FFMenu.Item key="3-3">Testando 3-3</FFMenu.Item>
          <FFMenu.Item key="3-4">Testando 3-4</FFMenu.Item>
        </FFMenu.SubMenu>
        <FFMenu.Item key="4" icon="credit_card">Testando 4</FFMenu.Item>
      </FFMenu>
);

So, as you can see in the component FFMenu i pass the "onClick" function.
When i select the first item "Testando 1" and use arrows it'll navigate normally, when i press "Enter" the console.log(); shows up.
The problem is that when I'm using the arrows in any Item inside a SubMenu when i press enter, it'll close the SubMenu, and will not select the Item that was "hovered/active".

Checked the demos and examples and seems to be the same thing.
When we press enter in any item, the standard behavior should not be to "click" the item?

Sorry about my english and thanks for the attention.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions