react.js的使用

冰雪奇缘lb

已于 2022-02-21 10:18:17 修改

阅读量428

点赞数 1

分类专栏： react 文章标签： javascript vue.js node.js

于 2021-11-23 11:11:43 首次发布

本文链接：https://blog.csdn.net/weixin_44682587/article/details/121489020

版权

react 专栏收录该内容

28 篇文章 1 订阅

订阅专栏

建 index.html 文件
命令行 npm init 生成 packge.json 文件
命令行 npm i react react-dom
引入react、react-dom，创建 react 元素，渲染 react 元素

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title></title>
</head>
<body>
	<div id="root"></div>
	<!-- 1 引入js文件 -->
	<script src="./node_modules/react/umd/react.development.js"></script>
	<script src="./node_modules/react-dom/umd/react-dom.development.js"></script>
	
	<script>
		// 2 创建react元素
		// 参数一：元素名称
		// 参数二：元素属性
		// 参数三：元素的子节点
		const title = React.createElement('h1', {id:'p1', className:'class'}, 'hello react')
		// 3 渲染react元素
		// 参数一：要渲染的react元素
		// 参数二：挂载点
		ReactDOM.render(title, document.getElementById('root'))
	</script>
</body>
</html>

在这里插入图片描述

使用`脚手架`创建 `react` 项目

命令行：npx create-react-app my-app
在这里插入图片描述

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

冰雪奇缘lb

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
react.js的使用

建 index.html 文件命令行 npm init 生成 packge.json 文件命令行 npm i react react-dom引入react、react-dom，创建 react 元素，渲染 react 元素<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wi.
复制链接

扫一扫