Как получить несколько данных из вызовов API в React js?

Я использовал django в качестве бэкенда и react в качестве фронтенда. Я могу вызвать api и показать детали товара, но в моем сериализаторе есть и сопутствующие товары. Я отправляю ответ связанного товара из моего сериализатора. Я хочу показать сопутствующий товар после раздела с подробной информацией о товаре. Как я могу вызвать объект?

#это мой сериализатор

class ProductWithRelatedSerializer(ProductSerializer):
    related = serializers.SerializerMethodField(read_only=True)
    
    class Meta:
        model = Product
        fields = '__all__'

    def get_related(self, obj):
        related = Product.objects.filter(
            category_id=obj.category_id
            ).exclude(_id=obj.pk).order_by('?').select_related('user')[:4]
        ps = ProductSerializer(related, many=True)
        return ps.data

это мой взгляд на продукт

@api_view(['GET'])
def getProduct(request, pk):
    product = Product.objects.get(_id=pk)
    serializer = ProductWithRelatedSerializer(product, many=False)
    return Response(serializer.data)

в моем фронтенд-редукторе

export const productDetailsReducer = (state = { product: {}}, action) => {
    switch (action.type) {
        case PRODUCT_DETAILS_REQUEST:
            return { loading: true, ...state }
        
        case PRODUCT_DETAILS_SUCCESS:
            return { loading: false, product: action.payload }

        case PRODUCT_DETAILS_FAIL:
            return { loading: false, error: action.payload }


        default:
            return state

    }
}

это мое действие

export const listProductDetails = (id) => async (dispatch) => {
    try {
        dispatch({ type: PRODUCT_DETAILS_REQUEST })

        const { data } = await axios.get(`/api/products/${id}`)

        dispatch({
            type: PRODUCT_DETAILS_SUCCESS,
            payload: data
        })
    }catch(error){
        dispatch({
            type: PRODUCT_DETAILS_FAIL,
            payload: error.response && error.response.data.detail
            ? error.response.data.detail
            : error.message,
        })
    }
}

это мой экран для подробной информации о продукте

Как в последней строке я вызываю product.description и получаю описание, но для связанного товара как я должен вызвать?

Вернуться на верх