title: Add dynamic html attributes to child component from parent component - React.js
body: <p>Child Component:</p>
  
  <pre><code>export default class Button extends React.Component {
  constructor(props) {
      super(props);
  }
  render() {
   return(
          &lt;div className="form-group"&gt;
              &lt;button
  
                  // Need to add dynamic html attr here e.x: data-id
  
                  key={index} 
                  id={id} 
                  className={`btn btn-default ${componentClass ? componentClass : null }`} 
                  type="button"
                  onClick={this.props.onClick}&gt; 
  
                  {text}
  
              &lt;/button&gt;
          &lt;/div&gt;
      );}}
  </code></pre>
  
  <p>Parent Component :</p>
  
  <pre><code>import Button from './Button';
  
  Class App extends React.Component {
      constructor(props) {
          super(props);
      }
      render() {
          return (
              &lt;div className="s"&gt;
               &lt;Button data-id="exampleData" /&gt;  // Need to add data-id attr to child button
              &lt;/div&gt;
          );
      }
  </code></pre>
  
  <p>Button Component, have it's own default attributes like mentioned above : id,className,type,onClick</p>
  
  <p>Parent Component, will call Button component and add some additional attributes like data-id,onChange.</p>
  
  <p>note : after searched few ideas, I know that i can use spread operators like below :</p>
  
  <p>Parent Component : </p>
  
  <pre><code>let dynamicAttributes = {"data-id":"someString", "data-attr":"someString", "data-url":"someString"};
      return (
          &lt;div className="s"&gt;
           &lt;Button dataSrc={ btnSrc } {...dynamicAttributes} /&gt;
          &lt;/div&gt;
      );
  </code></pre>
  
  <p>I don't know how to call the dynamicAttributes in Button component as a html attrib</p>
  
  <p>Expecting a  good solution to this. Thanks in advance.</p>
  
  <p>Used Destructing and Babel Showing error(unexpected token) like below image.</p>
  
  <p><a href="https://i.stack.imgur.com/jiTHX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jiTHX.png" alt="enter image description here"></a></p>
  
  <p>note: Already installed preset-env and preset-react.</p>