react-操作组件上的属性

//Component1.jsx
import React from 'react';

var arr = [
  <h1>Hello world!</h1>,
  <h2>React is awesome!</h2>,
];
class Component1 extends React.Component {
    render() {
        return  <h1>Hello {this.props.name}</h1>
    }
}

//导出组件
export default Component1;

//main.js
import React from 'react';
import ReactDom from 'react-dom';
import Component1 from './components/Component1.jsx';

ReactDom.render(
    <Component1 name="John"/>,
    document.getElementById('content')
);

输出：Hello John

1. 组件的属性可以在组件类的 this.props 对象上获取
2. 比如 name 属性就可以通过 this.props.name 读取
3. 此外每个组建只能拥有一个顶层标签