解释 ReactJS 中 render() 的用途

React.js 库有两个组件：

• 类组件
• 功能组件

类组件使用渲染函数。 ReactDOM.render()函数有两个参数，HTML 代码和一个 HTML 元素。

渲染（）的目的：

• React 使用一个叫做 render() 的函数将 HTML 渲染到网页上。
• 该函数的目的是在指定的 HTML 元素内显示指定的 HTML 代码。
• 在 render() 方法中，我们可以读取 props 和 state 并将 JSX 代码返回到应用程序的根组件。
• 在 render() 方法中，我们不能改变状态，也不能产生副作用（比如向 webserver 发出 HTTP 请求）。

让我们通过一个例子来理解渲染函数。

创建 React 应用程序并安装模块：

第 1 步：使用以下命令创建一个 React 应用程序。

npx create-react-app foldername

第 2 步：创建项目文件夹（即文件夹名称）后，使用以下命令移动到该文件夹。

cd foldername

项目结构：它将如下所示。

现在在 App.js 文件中写下以下代码。

App.js

import React, { Component } from 'react';
export default class App extends Component {
state = {
    PawriDays: [
        { id: '123s', Day: 'Monday' },
        { id: '234r', Day: 'Saturday' },
        { id: '12d5', Day: 'Sunday' }
    ]
}
  
render() {
    const PartyDays = this.state.PawriDays.length
    const style = {
    'textAlign': 'center',
    'color': 'green'
    }
  
    // Return JSX code
    return (
    

        
I am User
        
 We party: {PartyDays} days a week 
    
    );
}
}

运行应用程序的步骤：从项目的根目录使用以下命令运行应用程序：

npm start

输出：现在打开浏览器并访问 http://localhost:3000/，您将看到以下输出：