React 的核心思想是:封装组件。
各个组件维护自己的状态和 UI,当状态变更,自动重新渲染整个组件。
基于这种方式的一个直观感受就是我们不再需要不厌其烦地来回查找某个 DOM 元素,然后操作 DOM 去更改 UI。
React 大体包含下面这些概念:
组件
JSX
Virtual DOM
Data Flow
一丶基本方式
index.js
import React from 'react'
import {render} from 'react-dom'
render(
<p>这是一个类组件</p>,
document.querySelector('#root')//模板html文件的ID为root
)
二丶使用类组件
index.js
import React from 'react'
import Render from 'react-dom'
class App extends React.component(
render(){
return <p>这是一个类组件</p>
}
)
render(
<App/>,
document.querySelector('root')
)
两者是同样的结果