一、React库说明
React库包含两部分:1、React包含了所有基本功能;2、ReactDOM只包含了操作DOM的功能。
1、加载React库
# 1、用<script>加载
开发版:<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
发布版:<!-- <script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
# 2、ES5 和 npm 环境中用require
var React = require('react')
# 3、ES6 和 npm 环境中用import
import React from 'react'
2、加载ReactDOM库
# 1、用<script>加载
开发版: <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
发布版:<script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>
# 2、ES5 和 npm 环境中用require
var ReactDOM = require('react-dom')
# 3、ES6 和 npm 环境中用import
import ReactDOM from 'react-dom'
二、HTML中使用React
只用浏览器原生支持特性来加载使用React,此种方式适合项目演示和学习用。
1、HTML配置React环境
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Add React in One Minute</title>
</head>
<body>
<!-- 第一步:设置父容器 -->
<div id="like_button_container"></div>
<!-- 第二步:加载开发版本的React -->
<script src="https://unpkg.com/react@16/umd/re