23、React应用中添加摘要组件与Firebase的使用指南

React应用中添加摘要组件与Firebase的使用指南

1. 在React应用中添加摘要组件

在React应用里，添加摘要组件能为用户提供输入数据的快速概览，增强应用的用户友好性与可访问性。以下是具体步骤：

1.1 创建摘要组件

首先，在 components 文件夹下创建 Summary.js 文件，定义 Summary 组件：

import React from 'react';
function Summary(props) {
    return (
        <div>
            <h2>Summary</h2>
            <p>{props.summaryText}</p>
        </div>
    );
}
export default Summary;

1.2 将摘要组件添加到主应用组件

在主应用组件中引入 Summary 组件，并传递 summaryText 状态变量：

import React, { useState } from 'react';
import Form from './Form';
import Summary from './Su