React

React基本使用

<div id=’root’></div>

1. 引入js文件

<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>

2. 创建react元素

<script>
      //参数一：元素名称
      //参数二：元素属性
      //参数三及其以后的参数：元素的子节点
      //声明一个元素接受创建的React元素
 const title = React.createElement(
'h1',
{title:'我是'}, 
'Hello React',
React.createElement('span', null, '我是span节点')
) </script>

3. 渲染react元素

//渲染react元素
      //参数一：要渲染的react元素
      //参数二：挂载点
      ReactDOM.render(title, document.getElementById('root'))

 

 

React脚手架的使用

1. npx create-react-app my-app

2. cd my-app

    npm start

3.

//1. 导入react
import React from 'react';
import ReactDOM from 'react-dom';

//2. 创建react元素
const title = React.createElement('h1', null, 'Hello React 脚手架')

//3. 渲染react元素
ReactDOM.render(title, document.getElementById('root'))

 

1.      创建react元素