Я следил за этим руководством а на странице заказов у меня ошибка, заказы не загружаются. Uncaught (в обещании) Typeerror: не может прочитать свойства неопределенного (чтение «Сообщение»). Я новичок в обучении JavaScript и Reduxjs и хочу попросить о помощи. Мой код: < /p>
import React, { useEffect } from "react";
import { useDispatch, useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
import { fetchUserOrders } from "../redux/slices/orderSlice";
const dispatch = useDispatch();
const navigate = useNavigate();
const { orders, loading, error } = useSelector((state) => state.orders);
useEffect(() => {
dispatch(fetchUserOrders());
}, [dispatch]);
const handleRowClick = (orderId) => {
navigate(`/order/${orderId}`);
};
if (loading) return
Loading ...
;
if (error) return
Error: {error}
;
< /code>
orderslice < /p>
import { createSlice, createAsyncThunk } from "@reduxjs/toolkit";
import axios from "axios";
export const fetchUserOrders = createAsyncThunk(
"orders/fetchUserOrders",
async (_, { rejectWithValue }) => {
try {
const response = await axios.get(
`${import.meta.env.VITE_BACKEND.URL}/api/orders/my-orders`,
{
headers: {
Authorization: `Bearer ${localStorage.getItem("userToken")}`,
},
}
);
return response.data;
} catch (error) {
return rejectWithValue(error.response.data);
}
}
);
export const fetchOrderDetails = createAsyncThunk(
"orders/fetchOrderDetails",
async (fetchOrderDetails, { rejectWithValue }) => {
try {
const response = await axios.get(
`${import.meta.env.VITE_BACKEND.URL}/api/orders/${orderId}`,
{
headers: {
Authorization: `Bearer ${localStorage.getItem("userToken")}`,
},
}
);
return response.data;
} catch (error) {
return rejectWithValue(error.response.data);
}
}
);
const orderSlice = createSlice({
name: "orders",
initialState: {
orders: [],
totalOrders: 0,
orderDetails: null,
loading: false,
error: null,
},
reducers: {},
extraReducers: (builder) => {
builder
.addCase(fetchUserOrders.pending, (state) => {
state.loading = true;
state.error = null;
})
.addCase(fetchUserOrders.fulfilled, (state, action) => {
state.loading = false;
state.orders = action.payload;
})
.addCase(fetchUserOrders.rejected, (state, action) => {
state.loading = false;
console.log(action);
state.error = action.payload.message;
})
.addCase(fetchOrderDetails.pending, (state) => {
state.loading = true;
state.error = null;
})
.addCase(fetchOrderDetails.fulfilled, (state, action) => {
state.loading = false;
state.orderDetails = action.payload;
})
.addCase(fetchOrderDetails.rejected, (state, action) => {
state.loading = false;
state.error = action.payload.message;
});
},
});
export default orderSlice.reducer;
< /code>
Backend < /p>
const orderItemSchema = new mongoose.Schema(
{
productId: {
type: mongoose.Schema.Types.ObjectId,
ref: "Product",
required: true,
},
name: {
type: String,
required: true,
},
image: {
type: String,
required: true,
},
price: {
type: Number,
required: true,
},
size: String,
color: String,
quantity: {
type: Number,
required: true,
},
},
{ _id: false }
);
const orderSchema = new mongoose.Schema(
{
user: {
type: mongoose.Schema.Types.ObjectId,
ref: "User",
required: true,
},
orderItems: [orderItemSchema],
shippingAddress: {
address: { type: String, required: true },
city: { type: String, required: true },
postalCode: { type: String, required: true },
country: { type: String, required: true },
},
paymentMethod: {
type: String,
required: true,
},
totalPrice: {
type: Number,
required: true,
},
isPaid: {
type: Boolean,
default: false,
},
paidAt: {
type: Date,
},
isDelivered: {
type: Boolean,
default: false,
},
deliveredAt: {
type: Date,
},
paymentStatus: {
type: String,
default: "pending",
},
status: {
type: String,
enum: ["Processing", "Shipped", "Delivered", "Cancelled"],
default: "Processing",
},
},
{ timestamps: true }
);
module.exports = mongoose.model("Order", orderSchema);
< /code>
orderroutes < /p>
const express = require("express");
const Order = require("../models/Order");
const { protect } = require("../middleware/authMiddleware");
const router = express.Router();
router.get("/my-orders", protect, async (req, res) => {
try {
const orders = await Order.find({ user: req.user._id }).sort({
createdAt: -1,
});
res.json(orders);
} catch (error) {
console.error(error);
res.status(500).json({ message: "Server error" });
}
});
router.get("/:id", protect, async (req, res) => {
try {
const order = await Order.findById(req.params.id).populate(
"user",
"name email"
);
if (!order) {
return res.status(404).json({ message: "Order not found" });
}
res.json(order);
} catch (error) {
console.error(error);
res.status(500).json({ message: "Server error" });
}
});
module.exports = router;
< /code>
Бэкэнд работает отлично я проверял через почтальника.
Я также отладко отладчил действие с console.log (action) и дает эту ошибку
{type: 'orders /fetchuserorders /despreceed', Payload: undefined, meta: {…}, ошибка: {…} < /p> wylobloader Неопределенный, но я не могу найти проблему. Будет рад любой помощи
Подробнее здесь: https://stackoverflow.com/questions/796 ... -reading-m
Uncaught (в обещании) TypeError: не могу прочитать свойства неопределенного (чтение «Сообщение») ⇐ Javascript
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение