[前端]React入门指南

React简介

React是一个用于构建用户界面的JavaScript库。它由Facebook开发，可以帮助开发者构建高效、可重用的UI组件。React通过使用组件来将用户界面分解为独立的部分，并通过每个组件的状态来更新界面。

以下是React入门的几个基本概念和步骤：

安装React：

首先需要在项目中安装React。可以使用npm或yarn来安装React和相关的依赖项。在终端中运行以下命令：

npm install react react-dom

创建一个React组件

在React中，可以创建自定义组件来构建用户界面。一个React组件是一个JavaScript类或函数，用于定义组件的特定行为和属性。例如，创建一个名为HelloWorld的组件：

import React from 'react';

class HelloWorld extends React.Component {
  render() {
    return <h1>Hello, World!</h1>;
  }
}

1. 渲染React组件：使用ReactDOM库将组件渲染到HTML页面中的DOM元素上。在项目中的index.js文件中添加以下代码：

import React from 'react';
import ReactDOM from 'react-dom';

class HelloWorld extends React.Component {
  render() {
    return <h1>Hello, World!</h1>;
  }
}

ReactDOM.render(<HelloWorld />, document.getElementById('root'));

1. 运行React应用程序：在终端中执行以下命令以启动React应用程序：

npm start

以上是React入门的基本步骤。从这里开始，可以学习更多关于React的高级概念，如状态管理、组件通信和路由等。可以参考React官方文档以深入了解React的更多内容。

事件处理

条件判断

有状态和无状态组件 

        更多时候我们应该区别使用无状态的组件,因为如果是有状态组件的话,它就会触发生命周期所对应的-一旦触发它生命周期的函数,它就会影响当前项目的运行。所以在尽可能的情况都使用无状态组件。除非对当前的组件不是很清晰是否要存储数据或者说已经确定了要进行一些数据存储和修改。

数据绑定及表单处理

元素渲染

 定时刷新：静止状态，并不能进行更新，所以我们可以使用一个定时

条件处理

用ES6结构获取参数