Django入门笔记（B站）

最新推荐文章于 2024-05-05 03:07:23 发布

我土豆去哪了

最新推荐文章于 2024-05-05 03:07:23 发布

阅读量211

点赞数 1

分类专栏：其他文章标签： python django

本文链接：https://blog.csdn.net/weixin_44233889/article/details/118719456

版权

其他专栏收录该内容

13 篇文章 0 订阅

订阅专栏

一、绘制个人的第一个页面

1、创建一个名为 ‘KG_show’ 的Django工程（也可直接在 Pycharm 创建工程）：

django-admin startproject KG_show

直接 Run —> Run ‘KG_show’ —> 点击链接：
在这里插入图片描述

2、创建一个名为 ‘front’ 的app：

python manage.py startapp front

在这里插入图片描述
3、在app中添加文件夹 ‘templates’ ：

4、在 settings.py 文件中修改相应的配置：

5、在app的 templates 文件夹下新建文件 ‘index.html’ ：

6、在app的 views.py 文件中写对应的调用函数：

7、在 urls.py 文件中写对应的调用地址：
在这里插入图片描述
运行 —> 点击链接 —> 输入对应网址：

~~分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线~~

二、尝试做一个简易加法计算器

1、在app的 templates 文件夹中添加文件 ‘calPage.html’ ：
在这里插入图片描述
编写相应的前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算页面</title>
</head>
<body>

<form method="post" action="/calAction/">
    {% csrf_token %} {# 因为后面要跳转到计算结果页面，这句话不可少 #}
    <input type="number" name="value_A">
    +
    <input type="number" name="value_B">
    <input type="submit" value="计算">
</form>


</body>
</html>

2、在app的 views.py 文件中添加对应的调用页面函数：

def calPage(requests):
    return render(requests, 'calPage.html')

3、在 urls.py 文件中添加对应的路径：
在这里插入图片描述
点击链接 —> 添加相应后缀：

4、在 urls.py 文件中为计算操作添加路径：

【个人理解】点击[计算按钮]—>触发表单action[’/calAction/’] —> 在 urls.py 中找到对应的路径[‘calAction/’] —> 调用 views.py 里对应的函数[calAction]，这里的path感觉是类似于桥梁的作用。

5、在 views.py 中添加函数 calAction() ：

def calAction(requests):
    # 根据‘name’从前端取得相应的值
    value_A = requests.POST['value_A']
    value_B = requests.POST['value_B']
    # 计算结果
    result = int(value_A) + int(value_B)
    # 其中context是将计算结果传回前端，格式为键值对
    return render(requests, 'calResult.html', context={'data': result})

6、在app的templates文件夹中添加文件 ‘calResult.html’ ：
在这里插入图片描述
编写相应的前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算结果页面</title>
</head>
<body>
<h1>计算结果：</h1>
<h2>{{ data }}</h2>  {# 根据键名取到从后端返回的值 #}
</body>
</html>

7、运行结果：
在这里插入图片描述

~~分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线~~

三、将上述计算保存到数据库

1、在app的 models.py 中定义类’cal’ ：

class cal(models.Model):
    value_A = models.CharField(max_length=10)
    value_B = models.CharField(max_length=10)
    result = models.CharField(max_length=10)

2、在Terminal中执行语句（用来创建表）：

python manage.py makemigrations
python manage.py migrate

在这里插入图片描述
3、查看表格：

4、修改app的 views.py 中的函数’calAction’（修改部分已标红）：

5、运行结果：

~~分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线~~

四、将数据库中的数据显示在网页

1、在app的templates文件夹下新建用于展示数据的页面 ‘calList.html’ ：
在这里插入图片描述
相应的前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数据列表</title>
</head>
<body>

<table border="1">
    <thead>
        <tr>
            <th>value_A</th>
            <th>value_B</th>
            <th>result</th>
        </tr>
        {% for i in data %}
        <tr>
            <td>{{ i.value_A }}</td>
            <td>{{ i.value_B }}</td>
            <td>{{ i.result }}</td>
        </tr>
        {% endfor %}
    </thead>
</table>

2、在app的 views.py 中新增函数 ‘calList’ ：

def calList(requests):
    data = cal.objects.all()
    # for i in data:
    #     print(i.value_A, i.value_B, i.result)
    return render(requests, 'calList.html', context={'data': data})

3、在 urls.py 中添加对应的路径：
在这里插入图片描述
4、运行结果：

5、新增清库功能，在 ‘calList.html’ 新增前端代码：

<form method="post" action="/delAction/">
    {% csrf_token %}
    <input type="submit" value="清库">
</form>

6、在 urls.py 中新增对应的路径：
在这里插入图片描述
7、在app的 views.py 文件中新增函数 ‘delAction’：

from django.http import HttpResponse

def delAction(requests):
    cal.objects.all().delete()
    return HttpResponse('已清库')

8、运行结果：
在这里插入图片描述

~~分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线分割线~~

五、异常处理

1、对app的 views.py 的 ‘calAction’函数进行修改：

def calAction(requests):
    if requests.POST:
        # 根据‘name’从前端取得相应的值
        value_A = requests.POST['value_A']
        value_B = requests.POST['value_B']
        # 计算结果
        result = int(value_A) + int(value_B)
        # 保存数据到数据库
        cal.objects.create(value_A= value_A, value_B= value_B, result= result)
        return render(requests, 'calResult.html', context={'data': result})
    else:
        return HttpResponse('请以POST访问！')

即当我们只有通过点击计算按钮（POST方式）去访问计算结果页面时，才正常运行，否则返回提示。
2、尝试通过直接输入网址访问计算结果页面：
在这里插入图片描述

我土豆去哪了

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Django入门笔记（B站）

1、在app的 templates 文件夹中添加文件 ‘calPage.html’ ：编写相应的前端代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>计算页面</title></head><body><form method="post" action="/calAction/"&g
复制链接

扫一扫