React学习日记二

 这两天学习了关于react组件component的相关知识，与之前学习的前端开发不同，之前分成html控制网页的结构css美化网页js实现动画交互之类的效果，而react中用组件化来开发，每个组件中都包含html，css，js的内容，将页面抽成一个个组件，像搭积木一样组成网页。
 创建组件的两种方法

1.使用 ES6 的 Class

class MyComponent extens React.Component{
   render(){
        return(
        <div><h1>hello,world</h1></div>
        )
   }
}
ReactDOM.render(<MyComponent />,document.getElementById('App'))

2.使用 Functional Component

const MyComponent =()=>(
<div>hello,world</div>
)
ReactDOM.render(<MyComponent />
,document.getElementById('App'))

组件的css咋个写？将css全部封装在js代码中

const Styles = { 
color: 'blue' 
};
ReactDOM.render(
<div style={Styles}>Hello World!</div>
, docume nt.getElementById('app'));