当前位置：网站首页>梅科尔工作室-DjangoWeb 应用框架+MySQL数据库第六次培训

<div class="cb-container">
    <div class="cb-title">
        <text class="cb-title-text">
            患者数据
        </text>
    </div>
    <div >
        <text style="font-size: 60px;">
            姓名 :
        </text>
        <text style="font-size: 60px;">{
   {detail[0].name}}</text>
    </div>
    <div>
        <text style="font-size: 60px;">
            年龄 :
        </text>
        <text style="font-size: 60px;">{
   {detail[0].age}}</text>
    </div>
    <div>
        <text style="font-size: 60px;">
            身高 :
        </text>
        <text style="font-size: 60px;">{
   {detail[0].high}}</text>
    </div>
    <div>
        <text style="font-size: 60px;">
            体重 :
        </text>
        <text style="font-size: 60px;">{
   {detail[0].weight}}</text>
    </div>
    <div>
        <text style="font-size: 60px;">
            患病部位 :
        </text>
        <text style="font-size: 60px;">{
   {detail[0].DiseasedSite}}</text>
    </div>
    <div class="container">
        <button onclick="onClick" class="btn-map" style="background-color: darkturquoise; height: 50px;">刷新</button>
    </div>
    <div class="container3">
        <text style="font-size: 70px;">
            {
   {winfo}}
        </text>
    </div>
</div>

1.2.2.JS代码

import router from '@system.router';
import fetch from '@system.fetch';
import qs from 'querystring';

export default {
    data:{
        winfo:"" ,//定义winfo用于存放后端反馈数据
        detail:[{ //初始化
                    name:"aaa",
                    age:66,
                    high:180,
                    weight:64,
                    DiseasedSite:"手臂"
                },
                {
                    name:"bbb"
                }
        ]
    },
    onClick(){
        fetch.fetch({
            url:`http://127.0.0.1:8000/student/getNewData/`, //后端路径，一定不能错，用的是反单引号
            data: qs.stringify({'patientname':'111'}),//验证，将字符串转发给后端，后端会受到这个请求
            responseType:"json",//请求的参数类型
            method: "POST",
            success:(resp)=>
            {
                var getdata
                //将JSON字符串转换为JSON对象
                getdata = JSON.parse(resp.data)
                this.detail[0].name=getdata[0].name
                this.detail[0].age=getdata[0].age
                this.detail[0].high=getdata[0].height
                this.detail[0].weight=getdata[0].weight
                this.detail[0].DiseasedSite=getdata[0].DiseasedSite
                this.winfo = resp.data;//令获取到的后端数据赋给winfo
                console.log("返回的数据："+this.winfo);//打印出数据
                console.log("a"+typeof(getdata));
            },
            fail:(resp)=>
            {
                console.log("获取数据失败："+this.detail)//打印出数据
            }
        });
    }
}

返回数据并进行键值操作代码如下：

                getdata = JSON.parse(resp.data)
                this.detail[0].name=getdata[0].name
                this.detail[0].age=getdata[0].age
                this.detail[0].high=getdata[0].height
                this.detail[0].weight=getdata[0].weight
                this.detail[0].DiseasedSite=getdata[0].DiseasedSite

1.3.DJango编程

新增路径，第三个就是

from django.urls import path
from . import views
from student.views import AppReq1,login,DocGetData
app_name ='student'
urlpatterns = [
    path('AppReq1/', AppReq1.as_view()),
    path('login/', login.as_view()),
    path('getNewData/', DocGetData.as_view()),

进行建表，记得迁移和执行

from django.db import models

from django.db import models

# Create your models here.
class Students(models.Model): #建表，定义一个类Students，包含Name，Email，Age信息
    # userName = models.CharField(max_length=64, default="")
    Name = models.CharField(max_length=64, default="")
    Age = models.CharField(max_length=64, default="")
    Height = models.CharField(max_length=64, default="")
    Weight = models.CharField(max_length=64, default="")
    DiseasedSite = models.CharField(max_length=64, default="")

手动添加一条数据

编写views.py代码

class DocGetData(APIView):  # DocGetData类视图
    def post(self,request):  # 创建post方法
        try:
            patientname = request.data.get('patientname')  # 获取前端发送的patientname
            print(patientname)  # 打印patientname
            result = models.Students.objects.filter(Name=patientname).last()
            # 使用filter方法查询数据表中Name=patientname的数据，last方法为查询最新，加last后为字典
            name = result.Name  # 获取result中的name
            age = result.Age  # 获取result中的age
            weight = result.Weight  # 获取result中的weight
            height = result.Height  # 获取result中的height
            diseasedSite = result.DiseasedSite  # 获取result中的diseasedSite
            alldata = []  # 创建空列表
            alldata.append({  # 写入如下字典，“键”要和前端对应
                'name': name, 'age': age, 'weight': weight, 'height': height,
                'DiseasedSite': diseasedSite,
            })
            alldata_json = json.dumps(alldata, ensure_ascii=False)  # 使中文正确显示
            return HttpResponse(alldata_json)
        except Students.DoesNotExist as e:
            print('刷新失败')
        else:
            return HttpResponse("请求失败")

result = models.Students.objects.filter(Name=patientname).last()，后方加上last即为获取最新数据，result更改为字典，不能进行for循环；