title: How to destruct `data-*` (hyphen cased) attributes from props?
body: <p>Im trying to convert one of my components to a functional stateless component (FSC). </p>
  
  <p>But FSC will not be optimized if using <code>...rest</code>, therefore i need to destruct the components props. </p>
  
  <p>I call Link as</p>
  
  <pre><code>&lt;Link to={link} data-navbar-click="close-menu"&gt;{name}&lt;/Link&gt;
  </code></pre>
  
  <p>then in Link i want to destruct the <strong>hyphen cased> data-navbar-click</strong> prop:</p>
  
  <pre><code>function Link({ to, className, onClick, target, rel, key, data-navbar-click}) {
  </code></pre>
  
  <p>However that doesnt compile. So i tried: </p>
  
  <pre><code>function Link({ to, className, onClick, target, rel, key, ['data-navbar-click']}) {
  </code></pre>
  
  <p>But that doesnt work as well.</p>