创建表以显示数据库中的行

问：

我正在尝试创建一个表，该表将显示名为 patients 的数据库的行，我使用 Django 作为后端并作为前端做出反应创建了这个表。当我尝试实现我迄今为止创建的代码时，我在网页上看到的唯一内容就是我的表头。需要注意的是，我已经检查了sqlite studio，表中存储了数据。我已经检查了 PostMan，我的 Get、POST、PUT 和 DELETE 方法都工作正常，并且按照我的意图执行操作。我使用Firefox作为浏览器，并且检查了正在检查的网络选项卡，但没有向后端发送任何内容。我将把我的初步尝试附在前端网页上

import React, {Component} from 'react'
export class ViewPatients extends Component{
    constructor(props){
        super(props);
        this.state = {
            patient: [],
        };
    }
    fetchPatients = () => {
        fetch('http://127.0.0.1:8000/patient')
        .then(response => response.json())
        .then(data=> {
            this.setState({patient:data});
        })
        .catch(error => {
            console.error("Error Fetching Patients")
        });
    };
    componentDidMounted(){
        this.fetchPatients();
        // this.refreshList();
    }
    render(){
        const {
            patient
        } = this.state;
        return(
            <div>
                <table>
                <thead>
                <tr>
                <th>ssn</th>    
                    <th>address</th>
                    <th>age</th>
                    <th>gender</th>
                    <th>race</th>
                    <th>
                    medical history
                    </th>
                    <th>occupation</th>
                    <th>phone number</th>
                    <th>username</th>
                </tr> 
                </thead>
                <tbody>
                    {patient.map(pat => (
                    <tr key={pat.ssn}>
                        <td>{pat.ssn}</td>              
                        <td>{pat.address}</td>
                        <td>{pat.age}</td>
                        <td>{pat.gender}</td>
                        <td>{pat.race}</td>
                        <td>{pat.medicalHistory}</td>
                        <td>{pat.occupation}</td>
                        <td>{pat.phoneNumber}</td>
                        <td>{pat.username}</td>
                    <td>{/* Display scheduled vaccines here */}</td>
                </tr>
                    ))}    
                </tbody>               
                </table>
            </div>
        )
    }
}

我也会提供我的 model.py 以供参考

def validate_length(phone):
    if not (phone.isdigit() and len(phone) == 10):
        raise ValidateError('%(phone)s must be 10 digits', params={'phone':phone})
def IDVarifier(id):
    if not (id.isdigit() and len(id) == 9):
        raise ValidateError('%(id)s must be 9 digits', params={'id':id})
class Patient(models.Model):
    ssn = models.CharField(primary_key = True, max_length = 9)
    address = models.CharField(max_length = 50,default = '123 fake st')
    age = models.IntegerField(default = 0)
    gender = models.CharField(default = 'None', max_length = 6)
    race = models.CharField(default = 'None', max_length = 10)
    medicalHistory = models.CharField(max_length = 200, default = 'None')
    occupationalClass = models.CharField(max_length = 100, default = 'None')
    phoneNumber = models.CharField(max_length = 10,validators = [validate_length], default = '1234567890')
    username = models.ForeignKey("Credentials",max_length = 10, default = "default", on_delete=models.SET_DEFAULT)