Click through nav handler eslint errors

Question

I have a sliding-menu component. It has items and I want to hide the menu when I click on each item. But if i click on Now I did so:

<nav onClick={this.handleClickCloseMenu}>
  <Link
    to="/smth"
    activeClassName="is-active"
  >
    smth
  </Link>
  <Link
    to="/smth2"
    activeClassName="is-active"
  >
    smth2
  </Link>
</nav>

Now I have an eslint errors: jsx-a11y/no-noninteractive-element-interactions end jsx-a11y/no-static-element-interactions I can set role button to nav but i guess it is wrong way. What do you think about?

Are you talking about hiding `nav` when current `url` is `/smth` or `/smth2`? Use a router for that — n1stre, Sep 25 '18 at 09:59
What do you mean? Handle a click on the Link and there hide the menu? — platypussss, Sep 25 '18 at 10:05
I mean you just could render you `nav` only when `path='/' exact` — n1stre, Sep 25 '18 at 10:06
But I want to be able to open the menu on every page. And when you click on the item menu, the menu becomes hidden. It is sliding menu. — platypussss, Sep 25 '18 at 10:26
I just want handle each click on nav and dispatch a hide menu action(The menu opens elsewhere). — platypussss, Sep 25 '18 at 10:32
Got it, take a look at this: https://eslint.org/docs/user-guide/configuring#disabling-rules-with-inline-comments — n1stre, Sep 25 '18 at 10:37

score 0 · Accepted Answer · answered Sep 25 '18 at 11:32

I thought a little and decided to tie into the key parameter, it's generated by react-router. In componentDidUpdate, look at the key and if the current one differs from the previous one, then hide the menu. If it is open of course. streletss thank you for pushing a thought

Click through nav handler eslint errors

1 Answers1