オブジェクトを個々の属性に展開する ...演算子の使い方

オブジェクトを個々の属性に展開する ...演算子

MyAttributes.js

import React, {Component} from 'react';

export default class MyAttributes extends Component {
  render(){
    return(
      <ul>
        <li>名前：{this.props.name}</li>
        <li>年齢：{this.props.age}</li>
        <li>性別：{this.props.gender}</li>
      </ul>
    );
  }
}

index.js

const attr = {
  name: "田中",
  age: "31",
  gender: "male",

ReactDOM.render(
  <MyAttrbutes {...atr} />,
  document.getElementById("root");
);