无法使用reactJS中的Express从MySQL数据库用户表中获取所有用户答案

【问题标题】：Can't get all users from MySQL database users table using Express in reactJS无法使用reactJS中的Express从MySQL数据库用户表中获取所有用户
【发布时间】：2021-11-16 19:01:33
【问题描述】：

我正在使用 react-material-dashboard 查看管理员的统计信息。

我想在表格中显示我的所有用户，以便在管理仪表板中查看。我正在使用 Express 从我的数据库中获取用户，但是当我在浏览器中运行时，我收到了 GET http://localhost:3001/api/fetchUsers 404 (Not Found) 错误。

如何在我的 react-material-dashboard 中显示我的所有用户？

我做错了什么？

这是我的结构：

CustomersListResults.js：

import { useState, useEffect } from 'react';
import PerfectScrollbar from 'react-perfect-scrollbar';
import {
  Box,
  Card,
  Table,
  TableCell,
  TableHead,
  TablePagination,
  TableRow,
} from '@material-ui/core';
import Axios from 'axios';

const CustomerListResults = () => {
  const [limit, setLimit] = useState(10);
  const [page, setPage] = useState(0);
  useEffect(() => {
    Axios.get('http://localhost:3001/api/fetchUsers').then((response) => {
      console.log(response);
    });
  }, []);
  const handleLimitChange = (event) => {
    setLimit(event.target.value);
  };

  const handlePageChange = (event, newPage) => {
    setPage(newPage);
  };

  return (
    <Card>
      <PerfectScrollbar>
        <Box sx={{ minWidth: 1050 }}>
          <Table>
            <TableHead>
              <TableRow>
                <TableCell>
                  Account
                </TableCell>
                <TableCell>
                  Name
                </TableCell>
                <TableCell>
                  Email
                </TableCell>
                <TableCell>
                  Location
                </TableCell>
                <TableCell>
                  Phone
                </TableCell>
                <TableCell>
                  Registration date
                </TableCell>
                <TableCell>
                  Action
                </TableCell>
              </TableRow>
            </TableHead>
          </Table>
        </Box>
      </PerfectScrollbar>
      <TablePagination
        component="div"
        count={5}
        onPageChange={handlePageChange}
        onRowsPerPageChange={handleLimitChange}
        page={page}
        rowsPerPage={limit}
        rowsPerPageOptions={[5, 10, 25]}
      />
    </Card>
  );
};

export default CustomerListResults;

客户列表：

import { Helmet } from 'react-helmet';
import { Box, Container } from '@material-ui/core';
import CustomerListResults from '../components/customer/CustomerListResults';
import CustomerListToolbar from '../components/customer/CustomerListToolbar';

const CustomerList = () => (
  <>
    <Helmet>
      <title>Customers | </title>
    </Helmet>
    <Box
      sx={{
        backgroundColor: 'background.default',
        minHeight: '100%',
        py: 3
      }}
    >
      <Container maxWidth={false}>
        <CustomerListToolbar />
        <Box sx={{ pt: 3 }}>
          <CustomerListResults />
        </Box>
      </Container>
    </Box>
  </>
);

export default CustomerList;

我的服务器 API：

//API To Get All Users
app.get("api/fetchUsers", (req, res) => {

    db.query("SELECT * FROM users", (req, res) => {
        if (err){
            console.log(err)
        }else{
            console.log(result);
            res.send(result)
        }
      });
});

【问题讨论】：

标签： javascript mysql node.js reactjs express

【解决方案1】：

下面一行的变化，在开头添加/：

app.get("/api/fetchUsers", (req, res) => {})

【讨论】：

非常感谢，一个简单的错误让你想知道为什么代码没有运行。
经常发生在开发人员身上 :)