Почему я получаю "Not Found: /api/products/undefined" вместо /api/products/1?

Я хочу получить данные одного продукта из "api/products/id" (я использую Django Rest Framework) и поместить их в redux store, чтобы при обновлении страницы продукта данные действительно отображались
. Проблема в том, что когда я захожу на "localhost:3000/products/1" (я использую также React), вместо того, чтобы получить продукт с id = 1, я получаю неопределенный продукт и вообще никаких данных. Более глубокое место, где id не определен, я нашел в views.py

Почему возникает эта проблема? Это как-то связано с миграцией? Я удалил *.pyc + *.py файлы, кроме init, а затем снова запустил makemigrations и migrate, но ничего не изменилось

И как я могу решить эту проблему?

Консоль браузера: Browser's consol

Терминал кодов VS enter image description here

views.py

@api_view(['GET'])
def getProduct(request, pk):

    print("\n\n\nPlural key: ", pk) # The pk is undefined
    product = Product.objects.get(id=pk) # So the product also is undefined
    serializer = ProductSerializer(product, many=False)
    return Response(serializer.data)

serializer.py

class ProductSerializer(serializers.ModelSerializer):
    class Meta:
        model = Product
        fields = '__all__'

models.py

from django.contrib.auth.models import User

class Product(models.Model):
    # ID is generating automatically
    user = models.ForeignKey(User, on_delete=models.SET_NULL, null=True)
    name = models.CharField(max_length=200, null=True, blank=True)
    image = models.ImageField(null=True, blank=True,
                              default='/placeholder.png')
    brand = models.CharField(max_length=200, null=True, blank=True)
    category = models.CharField(max_length=200, null=True, blank=True)
    description = models.TextField(null=True, blank=True)
    rating = models.DecimalField(
        max_digits=7, decimal_places=2, null=True, blank=True)
    numReviews = models.IntegerField(null=True, blank=True, default=0)
    price = models.DecimalField(
        max_digits=7, decimal_places=2, null=True, blank=True)
    countInStock = models.IntegerField(null=True, blank=True, default=0)
    createdAt = models.DateTimeField(auto_now_add=True)

    def __str__(self):
        return self.name

urls.py

urlpatterns = [
    path('', views.getRoutes, name='routes'),
    path('products/', views.getProducts, name='products'),
    path('products/<int:pk>', views.getProduct, name='product'),
]

Изначально было <str:pk>, но оно выбрасывало ValueError, поэтому изменили на <int:pk>.

Я думаю, что проблема в react. Пожалуйста, убедитесь, что URL API запроса правильный. В коде на стороне бэкенда проблем нет.

Ваш код Back-end кажется нормальным. Я полагаю, что происходит то, что ваш front-end (функция fetchSingleProduct) не получает идентификатор товара, который ему нужен.

Обновление от ОП.

Причина, по которой она не получает id товара, заключается в том, что в useEffect "productId" передается в качестве аргумента стрелочной функции. Но поскольку эта функция никогда не вызывается за пределами своего объявления, стрелочная функция не получает никакого id, поэтому вместо него получает "undefined".

Чтобы решить эту проблему, пожалуйста, удалите аргумент "productId" из функции arrow. После этого код будет работать, но появится предупреждение:

У реакт-хука useEffect отсутствует зависимость: 'productId'. Либо включите ее, либо удалите зависимость из массива react-hooks/exhaustive-deps

.

Чтобы получить его, просто передайте "productId" в массив, который является вторым аргументом useEffect.
Для подробностей проверьте: У хука useEffect отсутствуют зависимости. Либо включите их, либо удалите массив зависимостей react-hooks/exhaustive-deps

Код useEffect после изменений будет выглядеть следующим образом:

useEffect(() => {
        // If client doesn't have any data from server...
        if(status === 'idle') {
        // ...fetch for this data
        dispatch(fetchSingleProduct(productId))
        }
    }, [status, dispatch, productId])
Вернуться на верх