###
使用 Python Django Vue
MySQL 开发图书管理系统的概述
构建一个完整的图书管理系统涉及多个方面的工作，从前端界面设计到后端逻辑处理以及数据库交互。以下是针对这一特定应用领域内各组件的作用说明。
####
1. 后端开发 (
Django)
在 `settings
.py` 文件中配置数据库
连接参数以确保能够顺利访问
MySQL 数据库[^2]：
```
python
DATABASES = {
&#
39;default&#
39;: {
&#
39;ENGINE&#
39;: &#
39;
django.db
.backends
.mysql&#
39;,
&#
39;NAME&#
39;: &#
39;library_management_system&#
39;, # 替换为实际
使用的数据库名称
&#
39;USER&#
39;: &#
39;root&#
39;, # 用户名
&#
39;PASSWORD&#
39;: &#
39;&#
39;, # 密码
&#
39;HOST&#
39;: &#
39;localhost&#
39;, # 主机地址
&#
39;PORT&#
39;: &#
39;
330
6&#
39; # 端口号，默认情况下可以省略此选项
}
}
```
为了使应用程序能够在启动时自动加载并注册所需的驱动程序，在项目的根目录下的 `_init_
.py` 中加入如下代码片段来初始化 Py
MySQL 并将其作为默认的
MySQL 驱动器[^
1]:
```
python
import py
mysql
py
mysql.install_as_
MySQLdb()
```
定义模型类用于表示书籍实体及其属性字段，例如 ISBN 编号、书名、作者姓名等信息存储于关系型表格之中。通过继承自 `models
.Model` 的方式创建新的数据表结构体，并利用迁移命令同步至目标数据库实例当中去。
```
python
from
django.db import models
class Book(models
.Model):
isbn = models
.CharField(max_length=
13, unique=True)
title = models
.TextField(null=False)
author = models
.CharField(max_length=255, null=False)
# 执行 makemigrations 和 migrate 来更新 schema 变更
```
编写视图函数负责接收来自客户端发出的各种请求消息（GET/POST），并对之作出响应；同时也可以在此处实现业务流程控制逻辑，比如查询符合条件记录列表、新增单条或多条目项操作等功能特性支持。
```
python
from rest_framework
.views import APIView
from
.serializers import BookSerializer
from rest_framework
.response import Response
from
.models import Book
class BooksList(APIView):
def get(self, request):
books = Book
.objects
.all()
serializer = BookSerializer(books, many=True)
return Response(serializer
.data)
def post(self, request):
serializer = BookSerializer(data=request
.data)
if serializer
.is_valid():
serializer
.save()
return Response(status=status
.HTTP_20
1_CREATED)
return Response(serializer
.errors, status=status
.HTTP_400_BAD_REQUEST)
```
#### 2
. 前端展示 (Vue
.js)
安装必要的依赖包以便后续工作中调用 RESTful Web Service 接口获取远程服务器返回的数据集资源集合。
```bash
npm install axios vue-router --save
```
设置路由映射规则从而允许用户浏览
不同页面之间切换而无需刷新整个浏览器窗口标签页内容本身。
```javascript
// main
.js
import { createRouter, createWebHistory } from &#
39;vue-router&#
39;
import Home from &#
39;
./components/Home
.vue&#
39;
const routes = [
{ path: &#
39;/&#
39;, component: Home },
]
const router = createRouter({
history: createWebHistory(),
routes,
})
new Vue({ render: h => h(App), router })
.$mount(&#
39;#app&#
39;)
```
创建组件文件夹用来放置各个独立功能模块对应的 HTML 模板标记语言描述文档以及其他静态资产素材资料等等。
```html
<!-- components/Home
.vue -->
<template>
<div class="home">
<!-- 显示所有书籍 -->
<ul v-for="(book, index) in books" :key="index">
{{ book
.title }} by {{ book
.author }}
</ul>
<!-- 添加新书 -->
<form @submit
.prevent="addBook()">
Title:<input type="text" v-model="title"/>
Author:<input type="text" v-model="author"/>
<button>Add</button>
</form>
</div>
</template>
<script>
export default {
name: "Home",
data() {
return {
books: [],
title: "",
author: ""
};
},
methods: {
addBook() {
this
.$http
.post("/api/books/", {"title":this
.title,"author":this
.author})
.then(response=>{
console
.log(&#
39;success&#
39;);
});
}
},
mounted(){
this
.$http
.get(&#
39;/api/books/&#
39;)
.then((response)=>{
this
.books=response
.body;
})
}
};
</script>
```
####
3. 客户端与服务端通信机制
采用 Axios 库发起 HTTP 请求并与远端 API 进行互动交流，进而完成诸如读取现有藏品详情概览或是提交待录入的新作品元数据等一系列在线事务活动过程中的信息交换工作。
```javascript
axios
.defaults
.baseURL = &#
39;/api/&#
39;;
axios
.interceptors
.request
.use(config => config);
axios
.interceptors
.response
.use(res => res);
async function fetchBooks() {
try {
const response = await axios
.get(&#
39;books/&#
39;);
console
.table(response
.data); // 输出接收到的结果对象数组形式呈现给开发者查看调试用途
} catch(error){
alert(`Error fetching books ${error}`);
}
}
fetchBooks();
```
本文介绍了如何使用Python连接MySQL数据库并解决过程中遇到的兼容性问题。通过安装pymysql模块并进行适当的配置，可以顺利地在Django项目中实现与MySQL数据库的交互。
扫一扫
1471
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
