React基础教程（02）：React的基本使用

已于 2024-08-14 18:30:34 修改
阅读量863 收藏 1
点赞数
分类专栏： React教程 React基础教程 文章标签： react.js javascript
于 2023-06-15 16:41:53 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/WwLK123/article/details/131230732
版权
本文是React基础教程的第二部分，主要讲解如何使用React的基本操作，包括引入React依赖，创建容器，通过JSX和纯JS创建虚拟DOM，并对比虚拟DOM与真实DOM的区别。重点介绍了JSX在创建虚拟DOM时的便利性。
摘要由CSDN通过智能技术生成

React基础教程(二)：React的基本使用

1、HelloReact

1.1 引入react基础依赖包

注意点：①必须要在②之前引入在这里插入图片描述

	<!--    引入react核心库-->
    <script src="../js/react.development.js">
了解本专栏 订阅专栏 解锁全文 超级会员免费看
叁拾舞
关注
专栏目录
订阅专栏
React基础教程：TodoList案例
WwLK123的博客
06-12 931
react的状态state学习的经典案例：todolist
React学习笔记之React的基本使用
HJHAlone的博客
03-17 422
一、react基础 1.使用react 2.react脚手架的使用 1）初始化项目， 在项目根目录输入 npx create-react-app my-app，初始化一个名为my-app的项目 2）启动项目， 进入项目根目录（my-app），在项目根目录中执行 yarn start 或者 npm start 3）在react脚手架中使用react 二、react的JSX 1.jsx的基本使用 1）creatElement()的问题 2）jsx简介 ...
react个人笔记---引入那三个必须使用的库（附链接） -- 引入react库等简单操作
qq_52138438的博客
03-26 1846
react个人笔记 – 引入react库等简单操作 萌新作者在线卑微记录自己学习React的历程 代码及笔记 来自 尚硅谷学习视频 学习React首先要引入react库,库可在react官方网站下载,具体操作如下： 1.先进入官网(百度搜索react就行) React官网 2.点文档，再点右边的CDN链接 复制这几段地址 https://unpkg.com/react@16/umd/react.development.js https://unpkg.com/react-dom@16/umd/react
React教程（详细版）
热门推荐
Ronychen的博客
03-19 20万+
一、简介（背景） 1.1、概念 它是一个将数据渲染为HTML视图 的js库 1.2、原生js痛点 用dom的API去操作dom，繁琐且效率低 用js直接操作dom，浏览器会进行大量的回流和重绘 原生jjs没有组件化的编程方案，代码复用性低，哪怕有模块话的概念，但模块化也只能拆解一个个js，对样式和结构也没办法拆解，组件化就相当于3剑客整体拆解，成为一个个的小功能 1.3、React特点 采用组件化模式，声明式编码，提高开发效率和组件复用性 在React Native中可以用react预发进行安卓、io
react基本使用
小白小白从不日别的博客
06-02 1876
主要介绍了 react 的起源以及特点、基本使用步骤
react快速开始(一)-入门基础
西京刀客
10-09 1万+
react快速开始-入门基础 在前端框架框架方面，其中的佼佼者React和AngularJS均出名门公司，具有非凡的影响力和号召力。尤其是React，它定位于前端组件化、高性能和跨平台，它提出的基于虚拟DOM的理念一出现就获得了广泛的关注和认可，也被AngularJS等其他前端框架所引入。
React框架速成技巧：前端新手变高手指导教程
06-12
通过这个教程，您不仅将学习到React的基础知识，还将掌握如何将这些知识应用到实际项目中，解决开发过程中的常见问题。此外，提供的"说明文档.txt"可能包含更多关于教程结构、学习路径和额外资源的详细信息，帮助您...
react-demo:react基础教程
05-03
在本教程“react-demo”中，我们将深入学习React的基础知识，结合Redux进行状态管理，帮助你更好地理解和运用这两个强大的工具。 首先，React的核心概念是组件。组件是React中的独立、可重用的代码块，它们可以像...
React框架速成技巧：前端新手变高手指导教程（word文档）
最新发布
06-12
一、React基础知识 React是一个由Facebook维护的开源库，它采用组件化开发方式，让开发者可以创建可复用的UI部件。React主要关注视图层，但也可以与其他库结合，如Redux或MobX进行状态管理，形成完整的前端开发解决...
React app 的容器化
学习笔记
04-28 390
首先在 React app 工程目录中添加 Dockerfile: 1. Dockerfile： FROM node:16 WORKDIR /app COPY package.json . RUN npm install COPY . . EXPOSE 3000 CMD ["npm", "start"] 使用 node:16 是因为使用 node:17 或者 node:18 都会出现如下的错误信息： Error: error:0308010C:digital envelope routin
导入 react 的正确方法
熊小露的博客
03-02 2479
目前我们常见的有两种引入react的方法 import React from 'react'; // vs import * as React from 'react'; 这两种写法目前都可以运行，但是同一个目的出现两种写法就容易产生分歧，本文主要阐述这两种写法的不同并给出我建议的写法。 便捷性 从便捷性角度来讲，无疑第一种方式要少打好多字符。另外如果我们要引用react包内的其它导出项时，第一种方式的有点更明显： import React, { useState } from...
React---react的基本使用
前端与计算机相关知识的分享，博主的qq523235674
03-20 2651
一.React概述 1.什么是React React是一个用于构建用户界面的JavaScript库。 用户界面:HTML页面(前端) React主要用来写HTML页面，或构建Web应用 如果从MVC的角度来看，React仅仅是视图层(V)，也就是只负责视图的渲染，而并非提供了完整的M和C的功能。 React起源于Facebook的内部项目，后又用来架设Instagram的网站，并于2013年5月开源 2.React的特点 1.声明式 你只需要描述UI( HTML)看起来是什么样，就跟写..
React基本使用
奶茶控
03-26 1763
概念 React是一个用于构建用户界面的JavaScript库 React只要用来写HTML页面，或构建Web应用 如果从MVC的角度来看，React仅仅是视图层（V），也就是只负责视图的渲染，而并非提供了完成的M和C的功能 基本使用 1、安装React 安装命令：npm i react react-dom react包是核心，提供创建元素、组件等功能 react-dom包提供DOM相关功能等 2、引入两个js文件、创建React元素、渲染React元素到页面中 1）创...
React路由基本用法
u012475786的专栏
01-28 9283
React路由基本用法 1.React Router4.0基本概述： React Router4.0（以下简称 RR4）遵循React的设计理念，即万物皆组件。所以 RR4 只是一堆 提供了导航功能的组件（还有若干对象和方法），具有声明式（声明式编程简单来讲就是你只需要关心做什么，而无需关心如何去做，可组合性的特点。 RR4 采用单代码仓库模型架构（monorepo），这意味者这个仓库里面有...
React环境配置和基本使用
fareise的博客
09-03 1万+
1.准备：配置好Node环境，并且安装npm工具2.安装依赖包npm install babel -g npm install webpack -g npm install webpack-dev-server -g上面这三个依赖包都需要安装到全局，因为需要使用它们的命令行工具。其中babel是一个可以将ES6代码转换成ES5代码，这样我们就可以在编写代码的时候使用ES6的一些新特性了。webpa
如何在项目中使用 react --Y.
小烨！
08-10 2269
1.运行 cnpm i react react-dom -S 安装包 react： 专门用于创建组件和虚拟DOM的，同时组件的生命周期都在这个包中 react-dom：专门进行DOM操作的，最主要的应用场景，就是ReactDOM.render() 2.在index.html页面中，创建容器： &lt;!-- 容器，将来，使用 React 创建的虚拟DOM元素，都会被渲染到这个指定的容...
React之组件介绍及用法详解
意夏的博客
08-17 1万+
1.编写react应用程序 react开发需要引入多个依赖文件：react.js、react-dom.js，分别又有开发版本和生产版本，create-react-app里已经帮我们把这些东西都安装好了。把通过CRA创建的工程目录下的src目录清空，然后在里面重新创建一个index.js. 写入以下代码: // 从 react 的包当中引入了 React。只要你要写 React.js 组件就必须引入...
React Router基础教程：快速入门
本文将概述React Router的基础使用方法。 首先，React Router的引入有两种途径。对于不使用构建工具的简单场景，可以直接通过浏览器引入其提供的CDN链接或下载文件。引入后，可以使用`ReactRouter`对象中的`Router`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

叁拾舞

你的鼓励将是我最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值