從零開始學React(2)——編寫Hello World!

創建組件

1. 在已有的項目文件夾中，打開app文件夾，創建App.js文件作爲一個組件,輸入以下內容
   請注意，此處的文件名必須是大寫

import React from 'react'
//此處我們定義了一個名爲App的組件
//React 要求自定義組件必須是字母開頭!
//React 要求自定義組件的類必須繼承於React.Component類
class App extends React.Component{
	//組件中最重要的方法就是render方法，render是渲染的意思
	render(){
		//返回了一個jsx語法，很厲害的語法
		return <h1>Hello World!</h1>
	}
}
//向外暴露
export default App

2. 引用此組件，代碼如下

import React from 'react'
import {render} from 'react-dom'
//引入組件
import App from './App.js'
//使用、掛載組件，其有兩個參數
//第一個參數是jsx語法
//第二個參數是標識組件掛在哪個節點上
render(
  <App><App>,
  document.getElementById('app')
)

3. 當然，index.html的body中不要忘記寫上id爲app的這個dom元素

<div id="app"></div>