本文介绍: 要在books接口添加一个处理不同数据的新类,并希望通过 Django 管理后台添加显示这些数据,需要对三个文件进行修改

文件结构大致如下
要在books接口添加一个处理不同数据的新类,并希望通过 Django 管理后台添加显示这些数据,需要对三个文件进行修改

1.在 models.py 文件添加新的模型类。

例如,假设您要添加一个名为 Category 的新模型

from django.db import models

class Category(models.Model):
    name = models.CharField(max_length=100)
    # 其他字段...

2.在 serializers.py 文件创建新的序列化器类,

用于将 Category 模型的数据序列化。例如:

from rest_framework import serializers
from .models import Category

class CategorySerializer(serializers.ModelSerializer):
    class Meta:
        model = Category
        fields = '__all__'

3.在 views.py 文件创建新的视图集合

,用于处理 Category 模型的数据。例如:

from rest_framework import viewsets
from .models import Category
from .serializers import CategorySerializer

class CategoryViewSet(viewsets.ModelViewSet):
    queryset = Category.objects.all()
    serializer_class = CategorySerializer

4.在 urls.py 文件使用路由器router注册新的视图集合

例如:

from django.urls import path, include
from rest_framework import routers

from .views import BookViewSet, AuthorViewSet, CategoryViewSet

router = routers.DefaultRouter()
router.register(r'books', BookViewSet)
router.register(r'authors', AuthorViewSet)
router.register(r'categories', CategoryViewSet)

urlpatterns = [
    # 其他 URL 模式
    path('', include(router.urls)),
]

5.运行 Django 服务器

终端使用 python manage.py runserver 命令启动服务器

6.访问 Django 管理后台(

默认http://localhost:8000/admin/)。您需要添加相应的模型数据表,并为 Category 模型创建一些实例
admin后台需要创建

7.在浏览器导航

http://localhost:8000/books/categories/ 查看类别列表。这将显示通过管理后台添加类别数据,以 JSON 格式呈现
在进行任何更改之前,请确保进行数据库迁移,以更新数据库模式

前端需要读取该数据,可以考虑朝着方向修改

<template>
  <div>
    <ul>
      <li v-for="category in categories" :key="category.id">
        {{ category.name }}
      </li>
    </ul>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      categories: [],
    };
  },
  mounted() {
    this.fetchCategories();
  },
  methods: {
    fetchCategories() {
      axios
        .get('/api/categories/')  // 替换为您的后端 API 地址
        .then(response => {
          this.categories = response.data;
        })
        .catch(error => {
          console.error(error);
        });
    },
  },
};
</script>

原文地址:https://blog.csdn.net/weixin_45363995/article/details/131514769

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。

如若转载,请注明出处:http://www.7code.cn/show_13221.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注