如何在DRF上获取NUXT.JS中的数据

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

<script>
import axios from 'axios';

export default {
  data() {
    return {
      data: [],
    };
  },
  created() {
    this.fetchData();
  },
  methods: {
    fetchData() {
      axios.get('/api/data/')  // 发送GET请求到DRF的API端点
        .then(response => {
          this.data = response.data;  // 将返回的数据保存在组件的data属性中
        })
        .catch(error => {
          console.error(error);
        });
    },
  },
};
</script>

from rest_framework.views import APIView
from rest_framework.response import Response
from .serializers import DataSerializer
from .models import Data

class DataAPIView(APIView):
    def get(self, request):
        data = Data.objects.all()
        serializer = DataSerializer(data, many=True)
        return Response(serializer.data)

from rest_framework import serializers
from .models import Data

class DataSerializer(serializers.ModelSerializer):
    class Meta:
        model = Data
        fields = '__all__'