怎么把mysql数据库在页面显示

<?php
// 连接数据库
$servername = "数据库服务器地址";
$username = "数据库用户名";
$password = "数据库密码";
$dbname = "数据库名";
$conn = new mysqli($servername, $username, $password, $dbname);

// 查询数据库并获取数据
$sql = "SELECT * FROM 表名";
$result = $conn->query($sql);

// 在页面中显示数据
if ($result->num_rows > 0) {
    echo "<table>";
    while ($row = $result->fetch_assoc()) {
        echo "<tr><td>" . $row["列名1"] . "</td><td>" . $row["列名2"] . "</td></tr>";
    }
    echo "</table>";
} else {
    echo "没有数据";
}

// 关闭数据库连接
$conn->close();
?>

import React, { useEffect, useState } from "react";
import axios from "axios";

const MyComponent = () => {
  const [data, setData] = useState([]);

  useEffect(() => {
    // 发送AJAX请求获取数据库数据
    axios.get("/api/data").then((response) => {
      setData(response.data);
    });
  }, []);

  return (
    <table>
      <thead>
        <tr>
          <th>列名1</th>
          <th>列名2</th>
        </tr>
      </thead>
      <tbody>
        {data.map((item) => (
          <tr key={item.id}>
            <td>{item.column1}</td>
            <td>{item.column2}</td>
          </tr>
        ))}
      </tbody>
    </table>
  );
};

export default MyComponent;