Изображения в Vue.js и drf

В настоящее время я пытаюсь вывести изображения из моего DRF в мой шаблон vue.js. Я вижу массивы изображений в консоли и успешно использую Postman с запросом get, но я не могу отобразить несколько изображений в шаблоне vue. Я не уверен, нужно ли мне просмотреть массив фотографий в словаре урока или связать id с url фотографии? Любая помощь в этом вопросе будет очень признательна.

Vue.js

Views.py

@api_view(['GET'])
def get_lesson_photo(request, course_slug, lesson_slug):
    course = Course.objects.get(slug=course_slug)
    lesson_images = Lesson.objects.get(slug=lesson_slug)

    serializer = PhotoSerializer(lesson_images.photos.all(), many=True, context={'request': request})
    return Response(serializer.data)

Serializers.py:

class PhotoSerializer(serializers.ModelSerializer):
    photo_url = serializers.SerializerMethodField()
    class Meta:
        model = Photo
        fields = ("__all__") 
        
    #Not sure I need this....
    def get_photo_url(self, photo):
        request = self.context.get('request')
        photo_url = photo.photo.url
        return request.build_absolute_uri(photo_url)

class LessonListSerializer(serializers.ModelSerializer):   
    images = PhotoSerializer(required=False, many=True)
    class Meta:
        model = Lesson
        fields = ('id', 'title', 'slug', 'short_description', 'long_description','photos','images')
Вернуться на верх