heroku after deploying "TypeError: Cannot read properties of null (reading 'map')" due to localstorage
heroku after deploying "TypeError: Cannot read properties of null (reading 'map')" due to localstorage
当我将我的 mern stack 应用程序部署到 heroku 时。部署成功，但我在控制台中看到空白页面和以下错误。
TypeError: 无法读取 null 的属性（读取 'map'）
这是我对应的js文件，有错误。这个错误不会发生在本地主机上，在我部署了 heroku 之后。
这是我的context.js
const cartFromLocal = JSON.parse(localStorage.getItem("cartItems" || "[]"));
const [testArray, setTestArray] = useState(cartFromLocal);
const [cartCount, setCartCount] = useState(0);
const [cartTotal, setCartTotal] = useState(0);
const [cartItems, setCartItems] = useState();
const addtoCart = (product) =>{
const ProductExist = testArray.find((item) => item.id === product.id);
if (ProductExist) {
setTestArray(
testArray.map((item) => {
if (item.id === product.id) {
return { ...ProductExist, quantity: ProductExist.quantity + 1 };
} else {
return item;
}
})
);
} else {
product.quantity = 1;
setTestArray([...testArray, product]);
}
}
useEffect(() => {
let resultCount = 0;
let resultTotal = 0;
testArray.map((item) => {
resultCount += item.quantity;
resultTotal += item.quantity * item.price;
});
setCartCount(resultCount);
setCartTotal(resultTotal);
}, [testArray]);
localStorage.setItem('cartItems', JSON.stringify(testArray));
localStorage.setItem('cartTotal', JSON.stringify(cartTotal));
localStorage.setItem('cartCount', JSON.stringify(cartCount));
function reduceProduct(product){
const ProductExist = testArray.find((item) => item.id === product.id);
if(ProductExist.quantity === 1){
setTestArray(testArray.filter((item)=> item.id !== product.id));
}else{
setTestArray(
testArray.map((item) => item.id === product.id ? {...ProductExist, quantity: ProductExist.quantity-1} : item)
)
}
}
这个错误没有意义。即使数组为空，映射函数也应该起作用。我认为某些东西与 heroku 有关，因为它在 localhost 中工作。
这是我的 heroku 日志 --tail
2021-12-06T15:53:18.250747+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T15:53:19.411538+00:00 app[web.1]:
2021-12-06T15:53:19.411567+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T15:53:19.411570+00:00 app[web.1]: > node server.js
2021-12-06T15:53:19.411570+00:00 app[web.1]:
2021-12-06T15:53:19.745228+00:00 app[web.1]: Server is starting at 30706
2021-12-06T15:53:19.859271+00:00 app[web.1]: Mongoose is connected!
2021-12-06T15:53:20.061504+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T15:53:21.802770+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=0aeb9126-f463-4cdd-9406-55486da63eb1 fwd="130.75.173.103" dyno=web.1 connect=0ms service=22ms status=200 bytes=2645 protocol=https
2021-12-06T15:53:22.049726+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=4fbaa092-f10e-4fea-b54a-344f515a31e2 fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=200 bytes=24762 protocol=https
2021-12-06T15:53:22.054789+00:00 heroku[router]: at=info method=GET path="/static/js/2.a010bfcf.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=d8525bb8-434f-47c1-b95c-7c5298f2d593 fwd="130.75.173.103" dyno=web.1 connect=0ms service=13ms status=200 bytes=510662 protocol=https
2021-12-06T15:53:22.289397+00:00 heroku[router]: at=info method=GET path="/static/js/main.a2b4c5ec.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=136379bb-86d4-4075-bc3a-90ccbbda0d81 fwd="130.75.173.103" dyno=web.1 connect=0ms service=7ms status=200 bytes=32389 protocol=https
2021-12-06T15:53:23.637270+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=94e8aa11-2c4f-4c40-abc1-bdf9b239274e fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=819 protocol=https
2021-12-06T15:53:23.758258+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=7a1aa4d8-1e20-4457-ab5d-5f18f9d164dd fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=5654 protocol=https
2021-12-06T15:53:27.043080+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=47846a3e-ebac-4563-b909-a352c290e6e9 fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=270 protocol=https
2021-12-06T15:53:27.043511+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=55a7fd51-4640-46cd-9f84-a3c6fef2845a fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=269 protocol=https
2021-12-06T15:53:27.281397+00:00 heroku[router]: at=info method=GET path="/static/js/main.a2b4c5ec.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=7a485091-804a-4d0f-a4a3-b9db65d86eff fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=73344 protocol=https
2021-12-06T15:53:27.297760+00:00 heroku[router]: at=info method=GET path="/static/js/2.a010bfcf.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=ff1ba37d-ae7d-49fe-9f63-926ad22d1c02 fwd="130.75.173.103" dyno=web.1 connect=0ms service=17ms status=200 bytes=1679857 protocol=https
2021-12-06T15:53:27.298593+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=a58d41fe-8b9e-4132-b3ce-f74410638016 fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=200 bytes=70364 protocol=https
2021-12-06T16:03:43.000000+00:00 app[api]: Build started by user i.cagrigenc@gmail.com
2021-12-06T16:05:09.894803+00:00 app[api]: Release v7 created by user i.cagrigenc@gmail.com
2021-12-06T16:05:09.894803+00:00 app[api]: Deploy c7c9d2a9 by user i.cagrigenc@gmail.com
2021-12-06T16:05:10.000000+00:00 app[api]: Build succeeded
2021-12-06T16:05:10.204023+00:00 heroku[web.1]: Restarting
2021-12-06T16:05:10.336403+00:00 heroku[web.1]: State changed from up to starting
2021-12-06T16:05:11.583800+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2021-12-06T16:05:11.857057+00:00 heroku[web.1]: Process exited with status 143
2021-12-06T16:05:28.063281+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T16:05:29.853093+00:00 app[web.1]:
2021-12-06T16:05:29.853108+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T16:05:29.853109+00:00 app[web.1]: > node server.js
2021-12-06T16:05:29.853109+00:00 app[web.1]:
2021-12-06T16:05:30.863901+00:00 app[web.1]: Server is starting at 9441
2021-12-06T16:05:31.107129+00:00 app[web.1]: Mongoose is connected!
2021-12-06T16:05:31.376988+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T16:05:32.806668+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=cd6a86a2-8ed4-4e8b-b921-1613faf7bcf6 fwd="130.75.173.103" dyno=web.1 connect=0ms service=20ms status=200 bytes=2645 protocol=https
2021-12-06T16:05:33.190756+00:00 heroku[router]: at=info method=GET path="/static/js/main.e3aa1b98.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=8adf084e-8458-4a45-a16f-8e32f423d9a1 fwd="130.75.173.103" dyno=web.1 connect=0ms service=7ms status=200 bytes=32390 protocol=https
2021-12-06T16:05:33.207063+00:00 heroku[router]: at=info method=GET path="/static/js/2.915cc332.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=8565bbde-735d-4a21-b9dd-f5d1c0f5e7f8 fwd="130.75.173.103" dyno=web.1 connect=0ms service=27ms status=200 bytes=510649 protocol=https
2021-12-06T16:05:33.416390+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=0101b836-e6cb-4d16-bd8a-b0d33cc3f935 fwd="130.75.173.103" dyno=web.1 connect=0ms service=4ms status=200 bytes=24762 protocol=https
2021-12-06T16:05:34.592469+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=70e077cc-8db0-412f-9369-b5f440f79090 fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=819 protocol=https
2021-12-06T16:05:34.744773+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=3bcb41ce-e015-4873-b7ba-da4b8e880215 fwd="130.75.173.103" dyno=web.1 connect=0ms service=31ms status=200 bytes=5654 protocol=https
2021-12-06T16:05:38.906048+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=7d8b57f7-27dc-49df-92ed-2c41ba6dae50 fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=304 bytes=270 protocol=https
2021-12-06T16:05:38.910350+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=a1981d2c-3aa6-44d6-87bd-366a87395b2b fwd="130.75.173.103" dyno=web.1 connect=0ms service=8ms status=304 bytes=269 protocol=https
2021-12-06T16:05:39.127085+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=5276f551-b803-477a-8705-619d9a1bed49 fwd="130.75.173.103" dyno=web.1 connect=0ms service=16ms status=200 bytes=70364 protocol=https
2021-12-06T16:05:39.129097+00:00 heroku[router]: at=info method=GET path="/static/js/main.e3aa1b98.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=ec6f0eaf-34f1-4bd5-bd41-5064fb5f6673 fwd="130.75.173.103" dyno=web.1 connect=0ms service=16ms status=200 bytes=73407 protocol=https
2021-12-06T16:05:39.169638+00:00 heroku[router]: at=info method=GET path="/static/js/2.915cc332.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=4c860ed3-6591-4189-8b17-1528ad126204 fwd="130.75.173.103" dyno=web.1 connect=1ms service=59ms status=200 bytes=1679857 protocol=https
2021-12-06T16:07:41.000000+00:00 app[api]: Build started by user i.cagrigenc@gmail.com
2021-12-06T16:09:08.586821+00:00 app[api]: Release v8 created by user i.cagrigenc@gmail.com
2021-12-06T16:09:08.586821+00:00 app[api]: Deploy 7ef13987 by user i.cagrigenc@gmail.com
2021-12-06T16:09:08.825330+00:00 heroku[web.1]: Restarting
2021-12-06T16:09:08.890874+00:00 heroku[web.1]: State changed from up to starting
2021-12-06T16:09:09.000000+00:00 app[api]: Build succeeded
2021-12-06T16:09:09.941829+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2021-12-06T16:09:10.272491+00:00 heroku[web.1]: Process exited with status 143
2021-12-06T16:09:20.606258+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T16:09:22.906787+00:00 app[web.1]:
2021-12-06T16:09:22.906796+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T16:09:22.906797+00:00 app[web.1]: > node server.js
2021-12-06T16:09:22.906797+00:00 app[web.1]:
2021-12-06T16:09:23.685852+00:00 app[web.1]: Server is starting at 54927
2021-12-06T16:09:23.971225+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T16:09:24.130739+00:00 app[web.1]: Mongoose is connected!
2021-12-06T16:09:25.854999+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=9d8b5cac-6d1b-4cde-9dab-0ee4a85cc574 fwd="130.75.173.103" dyno=web.1 connect=0ms service=28ms status=200 bytes=2645 protocol=https
2021-12-06T16:09:26.188980+00:00 heroku[router]: at=info method=GET path="/static/js/2.cd0c6874.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=32625e82-2bcc-4d36-8deb-726aff1527e3 fwd="130.75.173.103" dyno=web.1 connect=1ms service=18ms status=200 bytes=510649 protocol=https
2021-12-06T16:09:26.189800+00:00 heroku[router]: at=info method=GET path="/static/js/main.17259788.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=4039b5e8-5cbb-4611-82c8-23d7f4d33f9a fwd="130.75.173.103" dyno=web.1 connect=0ms service=13ms status=200 bytes=32390 protocol=https
2021-12-06T16:09:26.408717+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=406d5545-c1a1-45fb-b83c-fe13422baaaf fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=24762 protocol=https
2021-12-06T16:09:27.759315+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=e021f679-ecd0-44b5-bc09-b740bb36a86b fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=819 protocol=https
2021-12-06T16:09:28.042263+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=86531785-1eb3-4619-9791-5fb886907fe0 fwd="130.75.173.103" dyno=web.1 connect=0ms service=4ms status=200 bytes=5654 protocol=https
2021-12-06T16:09:32.488254+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=1a1fd6bc-78ae-406c-b5e3-b0d38f69c328 fwd="130.75.173.103" dyno=web.1 connect=0ms service=3ms status=304 bytes=269 protocol=https
2021-12-06T16:09:32.488397+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=a300be6e-4d02-4d43-a865-ffd74a578b03 fwd="130.75.173.103" dyno=web.1 connect=0ms service=10ms status=304 bytes=270 protocol=https
2021-12-06T16:09:32.676650+00:00 heroku[router]: at=info method=GET path="/static/js/main.17259788.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=264001de-1140-4e94-beab-9b0aab828b44 fwd="130.75.173.103" dyno=web.1 connect=2ms service=17ms status=200 bytes=73470 protocol=https
2021-12-06T16:09:32.728373+00:00 heroku[router]: at=info method=GET path="/static/js/2.cd0c6874.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=d0cf54b1-30ca-432b-a075-2a7ef8240e36 fwd="130.75.173.103" dyno=web.1 connect=0ms service=32ms status=200 bytes=1679857 protocol=https
2021-12-06T16:09:32.781761+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=1411f28a-90a9-468b-a3ae-fd0a0ff7d23c fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=70364 protocol=https
2021-12-06T16:20:23.000000+00:00 app[api]: Build started by user i.cagrigenc@gmail.com
2021-12-06T16:21:52.808781+00:00 app[api]: Release v9 created by user i.cagrigenc@gmail.com
2021-12-06T16:21:52.808781+00:00 app[api]: Deploy 90167b38 by user i.cagrigenc@gmail.com
2021-12-06T16:21:53.000000+00:00 app[api]: Build succeeded
2021-12-06T16:21:53.194077+00:00 heroku[web.1]: Restarting
2021-12-06T16:21:53.235667+00:00 heroku[web.1]: State changed from up to starting
2021-12-06T16:21:54.389287+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2021-12-06T16:21:54.658056+00:00 heroku[web.1]: Process exited with status 143
2021-12-06T16:22:01.509095+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T16:22:02.762581+00:00 app[web.1]:
2021-12-06T16:22:02.762600+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T16:22:02.762600+00:00 app[web.1]: > node server.js
2021-12-06T16:22:02.762601+00:00 app[web.1]:
2021-12-06T16:22:03.160893+00:00 app[web.1]: Server is starting at 56888
2021-12-06T16:22:03.307149+00:00 app[web.1]: Mongoose is connected!
2021-12-06T16:22:03.319407+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T16:23:03.965446+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=c9767f6f-a4b2-4855-a036-d18b6cc2cd1b fwd="130.75.173.103" dyno=web.1 connect=0ms service=14ms status=200 bytes=2645 protocol=https
2021-12-06T16:23:04.242699+00:00 heroku[router]: at=info method=GET path="/static/js/main.b96b77fa.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=79cb6fd1-ef93-426a-8407-1f6e3cd63fbb fwd="130.75.173.103" dyno=web.1 connect=0ms service=3ms status=200 bytes=32390 protocol=https
2021-12-06T16:23:04.251866+00:00 heroku[router]: at=info method=GET path="/static/js/2.2d58c30e.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=4e3c1228-825b-4f1c-9959-1d4c21bca92e fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=510649 protocol=https
2021-12-06T16:23:04.472523+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=38c8750f-646e-40af-aca7-46e176256cee fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=200 bytes=24762 protocol=https
2021-12-06T16:23:05.425194+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=bb96c5d1-154f-47b1-83b1-685757181c18 fwd="130.75.173.103" dyno=web.1 connect=0ms service=3ms status=200 bytes=819 protocol=https
2021-12-06T16:23:05.555975+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=9ebf917d-b4c2-4d7c-af01-3d989fed1c77 fwd="130.75.173.103" dyno=web.1 connect=0ms service=8ms status=200 bytes=5654 protocol=https
2021-12-06T16:23:09.266849+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=caf86d2e-edaa-4c25-9519-2c9fbed3560d fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=269 protocol=https
2021-12-06T16:23:09.273012+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=aa61a279-1568-4bb7-b010-65495be2836f fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=270 protocol=https
2021-12-06T16:23:09.536458+00:00 heroku[router]: at=info method=GET path="/static/js/2.2d58c30e.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=468a24e6-ddb3-4bc6-837e-2abce96bc121 fwd="130.75.173.103" dyno=web.1 connect=0ms service=11ms status=200 bytes=1679857 protocol=https
2021-12-06T16:23:09.536747+00:00 heroku[router]: at=info method=GET path="/static/js/main.b96b77fa.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=53d091a3-06a4-4d91-aa7c-c06af1e523f5 fwd="130.75.173.103" dyno=web.1 connect=1ms service=6ms status=200 bytes=73472 protocol=https
2021-12-06T16:23:09.570000+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=bd3d9ad3-e46f-4762-9fad-3480c9b7d071 fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=70364 protocol=https
您正在尝试获得 "cartItems" || "[]"，它总是会给您 cartItems。因此，如果 localStorage 中没有任何内容，则此表达式将为 null:
const cartFromLocal = JSON.parse(localStorage.getItem("cartItems" || "[]"));
可以修复，例如，像这样：
const cartFromLocal = JSON.parse(localStorage.getItem("cartItems")) || [];
当我将我的 mern stack 应用程序部署到 heroku 时。部署成功，但我在控制台中看到空白页面和以下错误。
TypeError: 无法读取 null 的属性（读取 'map'）
这是我对应的js文件，有错误。这个错误不会发生在本地主机上，在我部署了 heroku 之后。
这是我的context.js
const cartFromLocal = JSON.parse(localStorage.getItem("cartItems" || "[]"));
const [testArray, setTestArray] = useState(cartFromLocal);
const [cartCount, setCartCount] = useState(0);
const [cartTotal, setCartTotal] = useState(0);
const [cartItems, setCartItems] = useState();
const addtoCart = (product) =>{
const ProductExist = testArray.find((item) => item.id === product.id);
if (ProductExist) {
setTestArray(
testArray.map((item) => {
if (item.id === product.id) {
return { ...ProductExist, quantity: ProductExist.quantity + 1 };
} else {
return item;
}
})
);
} else {
product.quantity = 1;
setTestArray([...testArray, product]);
}
}
useEffect(() => {
let resultCount = 0;
let resultTotal = 0;
testArray.map((item) => {
resultCount += item.quantity;
resultTotal += item.quantity * item.price;
});
setCartCount(resultCount);
setCartTotal(resultTotal);
}, [testArray]);
localStorage.setItem('cartItems', JSON.stringify(testArray));
localStorage.setItem('cartTotal', JSON.stringify(cartTotal));
localStorage.setItem('cartCount', JSON.stringify(cartCount));
function reduceProduct(product){
const ProductExist = testArray.find((item) => item.id === product.id);
if(ProductExist.quantity === 1){
setTestArray(testArray.filter((item)=> item.id !== product.id));
}else{
setTestArray(
testArray.map((item) => item.id === product.id ? {...ProductExist, quantity: ProductExist.quantity-1} : item)
)
}
}
这个错误没有意义。即使数组为空，映射函数也应该起作用。我认为某些东西与 heroku 有关，因为它在 localhost 中工作。
这是我的 heroku 日志 --tail
2021-12-06T15:53:18.250747+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T15:53:19.411538+00:00 app[web.1]:
2021-12-06T15:53:19.411567+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T15:53:19.411570+00:00 app[web.1]: > node server.js
2021-12-06T15:53:19.411570+00:00 app[web.1]:
2021-12-06T15:53:19.745228+00:00 app[web.1]: Server is starting at 30706
2021-12-06T15:53:19.859271+00:00 app[web.1]: Mongoose is connected!
2021-12-06T15:53:20.061504+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T15:53:21.802770+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=0aeb9126-f463-4cdd-9406-55486da63eb1 fwd="130.75.173.103" dyno=web.1 connect=0ms service=22ms status=200 bytes=2645 protocol=https
2021-12-06T15:53:22.049726+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=4fbaa092-f10e-4fea-b54a-344f515a31e2 fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=200 bytes=24762 protocol=https
2021-12-06T15:53:22.054789+00:00 heroku[router]: at=info method=GET path="/static/js/2.a010bfcf.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=d8525bb8-434f-47c1-b95c-7c5298f2d593 fwd="130.75.173.103" dyno=web.1 connect=0ms service=13ms status=200 bytes=510662 protocol=https
2021-12-06T15:53:22.289397+00:00 heroku[router]: at=info method=GET path="/static/js/main.a2b4c5ec.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=136379bb-86d4-4075-bc3a-90ccbbda0d81 fwd="130.75.173.103" dyno=web.1 connect=0ms service=7ms status=200 bytes=32389 protocol=https
2021-12-06T15:53:23.637270+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=94e8aa11-2c4f-4c40-abc1-bdf9b239274e fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=819 protocol=https
2021-12-06T15:53:23.758258+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=7a1aa4d8-1e20-4457-ab5d-5f18f9d164dd fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=5654 protocol=https
2021-12-06T15:53:27.043080+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=47846a3e-ebac-4563-b909-a352c290e6e9 fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=270 protocol=https
2021-12-06T15:53:27.043511+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=55a7fd51-4640-46cd-9f84-a3c6fef2845a fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=269 protocol=https
2021-12-06T15:53:27.281397+00:00 heroku[router]: at=info method=GET path="/static/js/main.a2b4c5ec.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=7a485091-804a-4d0f-a4a3-b9db65d86eff fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=73344 protocol=https
2021-12-06T15:53:27.297760+00:00 heroku[router]: at=info method=GET path="/static/js/2.a010bfcf.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=ff1ba37d-ae7d-49fe-9f63-926ad22d1c02 fwd="130.75.173.103" dyno=web.1 connect=0ms service=17ms status=200 bytes=1679857 protocol=https
2021-12-06T15:53:27.298593+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=a58d41fe-8b9e-4132-b3ce-f74410638016 fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=200 bytes=70364 protocol=https
2021-12-06T16:03:43.000000+00:00 app[api]: Build started by user i.cagrigenc@gmail.com
2021-12-06T16:05:09.894803+00:00 app[api]: Release v7 created by user i.cagrigenc@gmail.com
2021-12-06T16:05:09.894803+00:00 app[api]: Deploy c7c9d2a9 by user i.cagrigenc@gmail.com
2021-12-06T16:05:10.000000+00:00 app[api]: Build succeeded
2021-12-06T16:05:10.204023+00:00 heroku[web.1]: Restarting
2021-12-06T16:05:10.336403+00:00 heroku[web.1]: State changed from up to starting
2021-12-06T16:05:11.583800+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2021-12-06T16:05:11.857057+00:00 heroku[web.1]: Process exited with status 143
2021-12-06T16:05:28.063281+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T16:05:29.853093+00:00 app[web.1]:
2021-12-06T16:05:29.853108+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T16:05:29.853109+00:00 app[web.1]: > node server.js
2021-12-06T16:05:29.853109+00:00 app[web.1]:
2021-12-06T16:05:30.863901+00:00 app[web.1]: Server is starting at 9441
2021-12-06T16:05:31.107129+00:00 app[web.1]: Mongoose is connected!
2021-12-06T16:05:31.376988+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T16:05:32.806668+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=cd6a86a2-8ed4-4e8b-b921-1613faf7bcf6 fwd="130.75.173.103" dyno=web.1 connect=0ms service=20ms status=200 bytes=2645 protocol=https
2021-12-06T16:05:33.190756+00:00 heroku[router]: at=info method=GET path="/static/js/main.e3aa1b98.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=8adf084e-8458-4a45-a16f-8e32f423d9a1 fwd="130.75.173.103" dyno=web.1 connect=0ms service=7ms status=200 bytes=32390 protocol=https
2021-12-06T16:05:33.207063+00:00 heroku[router]: at=info method=GET path="/static/js/2.915cc332.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=8565bbde-735d-4a21-b9dd-f5d1c0f5e7f8 fwd="130.75.173.103" dyno=web.1 connect=0ms service=27ms status=200 bytes=510649 protocol=https
2021-12-06T16:05:33.416390+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=0101b836-e6cb-4d16-bd8a-b0d33cc3f935 fwd="130.75.173.103" dyno=web.1 connect=0ms service=4ms status=200 bytes=24762 protocol=https
2021-12-06T16:05:34.592469+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=70e077cc-8db0-412f-9369-b5f440f79090 fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=819 protocol=https
2021-12-06T16:05:34.744773+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=3bcb41ce-e015-4873-b7ba-da4b8e880215 fwd="130.75.173.103" dyno=web.1 connect=0ms service=31ms status=200 bytes=5654 protocol=https
2021-12-06T16:05:38.906048+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=7d8b57f7-27dc-49df-92ed-2c41ba6dae50 fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=304 bytes=270 protocol=https
2021-12-06T16:05:38.910350+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=a1981d2c-3aa6-44d6-87bd-366a87395b2b fwd="130.75.173.103" dyno=web.1 connect=0ms service=8ms status=304 bytes=269 protocol=https
2021-12-06T16:05:39.127085+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=5276f551-b803-477a-8705-619d9a1bed49 fwd="130.75.173.103" dyno=web.1 connect=0ms service=16ms status=200 bytes=70364 protocol=https
2021-12-06T16:05:39.129097+00:00 heroku[router]: at=info method=GET path="/static/js/main.e3aa1b98.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=ec6f0eaf-34f1-4bd5-bd41-5064fb5f6673 fwd="130.75.173.103" dyno=web.1 connect=0ms service=16ms status=200 bytes=73407 protocol=https
2021-12-06T16:05:39.169638+00:00 heroku[router]: at=info method=GET path="/static/js/2.915cc332.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=4c860ed3-6591-4189-8b17-1528ad126204 fwd="130.75.173.103" dyno=web.1 connect=1ms service=59ms status=200 bytes=1679857 protocol=https
2021-12-06T16:07:41.000000+00:00 app[api]: Build started by user i.cagrigenc@gmail.com
2021-12-06T16:09:08.586821+00:00 app[api]: Release v8 created by user i.cagrigenc@gmail.com
2021-12-06T16:09:08.586821+00:00 app[api]: Deploy 7ef13987 by user i.cagrigenc@gmail.com
2021-12-06T16:09:08.825330+00:00 heroku[web.1]: Restarting
2021-12-06T16:09:08.890874+00:00 heroku[web.1]: State changed from up to starting
2021-12-06T16:09:09.000000+00:00 app[api]: Build succeeded
2021-12-06T16:09:09.941829+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2021-12-06T16:09:10.272491+00:00 heroku[web.1]: Process exited with status 143
2021-12-06T16:09:20.606258+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T16:09:22.906787+00:00 app[web.1]:
2021-12-06T16:09:22.906796+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T16:09:22.906797+00:00 app[web.1]: > node server.js
2021-12-06T16:09:22.906797+00:00 app[web.1]:
2021-12-06T16:09:23.685852+00:00 app[web.1]: Server is starting at 54927
2021-12-06T16:09:23.971225+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T16:09:24.130739+00:00 app[web.1]: Mongoose is connected!
2021-12-06T16:09:25.854999+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=9d8b5cac-6d1b-4cde-9dab-0ee4a85cc574 fwd="130.75.173.103" dyno=web.1 connect=0ms service=28ms status=200 bytes=2645 protocol=https
2021-12-06T16:09:26.188980+00:00 heroku[router]: at=info method=GET path="/static/js/2.cd0c6874.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=32625e82-2bcc-4d36-8deb-726aff1527e3 fwd="130.75.173.103" dyno=web.1 connect=1ms service=18ms status=200 bytes=510649 protocol=https
2021-12-06T16:09:26.189800+00:00 heroku[router]: at=info method=GET path="/static/js/main.17259788.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=4039b5e8-5cbb-4611-82c8-23d7f4d33f9a fwd="130.75.173.103" dyno=web.1 connect=0ms service=13ms status=200 bytes=32390 protocol=https
2021-12-06T16:09:26.408717+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=406d5545-c1a1-45fb-b83c-fe13422baaaf fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=24762 protocol=https
2021-12-06T16:09:27.759315+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=e021f679-ecd0-44b5-bc09-b740bb36a86b fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=819 protocol=https
2021-12-06T16:09:28.042263+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=86531785-1eb3-4619-9791-5fb886907fe0 fwd="130.75.173.103" dyno=web.1 connect=0ms service=4ms status=200 bytes=5654 protocol=https
2021-12-06T16:09:32.488254+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=1a1fd6bc-78ae-406c-b5e3-b0d38f69c328 fwd="130.75.173.103" dyno=web.1 connect=0ms service=3ms status=304 bytes=269 protocol=https
2021-12-06T16:09:32.488397+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=a300be6e-4d02-4d43-a865-ffd74a578b03 fwd="130.75.173.103" dyno=web.1 connect=0ms service=10ms status=304 bytes=270 protocol=https
2021-12-06T16:09:32.676650+00:00 heroku[router]: at=info method=GET path="/static/js/main.17259788.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=264001de-1140-4e94-beab-9b0aab828b44 fwd="130.75.173.103" dyno=web.1 connect=2ms service=17ms status=200 bytes=73470 protocol=https
2021-12-06T16:09:32.728373+00:00 heroku[router]: at=info method=GET path="/static/js/2.cd0c6874.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=d0cf54b1-30ca-432b-a075-2a7ef8240e36 fwd="130.75.173.103" dyno=web.1 connect=0ms service=32ms status=200 bytes=1679857 protocol=https
2021-12-06T16:09:32.781761+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=1411f28a-90a9-468b-a3ae-fd0a0ff7d23c fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=70364 protocol=https
2021-12-06T16:20:23.000000+00:00 app[api]: Build started by user i.cagrigenc@gmail.com
2021-12-06T16:21:52.808781+00:00 app[api]: Release v9 created by user i.cagrigenc@gmail.com
2021-12-06T16:21:52.808781+00:00 app[api]: Deploy 90167b38 by user i.cagrigenc@gmail.com
2021-12-06T16:21:53.000000+00:00 app[api]: Build succeeded
2021-12-06T16:21:53.194077+00:00 heroku[web.1]: Restarting
2021-12-06T16:21:53.235667+00:00 heroku[web.1]: State changed from up to starting
2021-12-06T16:21:54.389287+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2021-12-06T16:21:54.658056+00:00 heroku[web.1]: Process exited with status 143
2021-12-06T16:22:01.509095+00:00 heroku[web.1]: Starting process with command `npm start`
2021-12-06T16:22:02.762581+00:00 app[web.1]:
2021-12-06T16:22:02.762600+00:00 app[web.1]: > flower-shop-v4@1.0.0 start /app
2021-12-06T16:22:02.762600+00:00 app[web.1]: > node server.js
2021-12-06T16:22:02.762601+00:00 app[web.1]:
2021-12-06T16:22:03.160893+00:00 app[web.1]: Server is starting at 56888
2021-12-06T16:22:03.307149+00:00 app[web.1]: Mongoose is connected!
2021-12-06T16:22:03.319407+00:00 heroku[web.1]: State changed from starting to up
2021-12-06T16:23:03.965446+00:00 heroku[router]: at=info method=GET path="/" host=secret-hollows-83101.herokuapp.com request_id=c9767f6f-a4b2-4855-a036-d18b6cc2cd1b fwd="130.75.173.103" dyno=web.1 connect=0ms service=14ms status=200 bytes=2645 protocol=https
2021-12-06T16:23:04.242699+00:00 heroku[router]: at=info method=GET path="/static/js/main.b96b77fa.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=79cb6fd1-ef93-426a-8407-1f6e3cd63fbb fwd="130.75.173.103" dyno=web.1 connect=0ms service=3ms status=200 bytes=32390 protocol=https
2021-12-06T16:23:04.251866+00:00 heroku[router]: at=info method=GET path="/static/js/2.2d58c30e.chunk.js" host=secret-hollows-83101.herokuapp.com request_id=4e3c1228-825b-4f1c-9959-1d4c21bca92e fwd="130.75.173.103" dyno=web.1 connect=0ms service=5ms status=200 bytes=510649 protocol=https
2021-12-06T16:23:04.472523+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=38c8750f-646e-40af-aca7-46e176256cee fwd="130.75.173.103" dyno=web.1 connect=0ms service=6ms status=200 bytes=24762 protocol=https
2021-12-06T16:23:05.425194+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=bb96c5d1-154f-47b1-83b1-685757181c18 fwd="130.75.173.103" dyno=web.1 connect=0ms service=3ms status=200 bytes=819 protocol=https
2021-12-06T16:23:05.555975+00:00 heroku[router]: at=info method=GET path="/logo192.png" host=secret-hollows-83101.herokuapp.com request_id=9ebf917d-b4c2-4d7c-af01-3d989fed1c77 fwd="130.75.173.103" dyno=web.1 connect=0ms service=8ms status=200 bytes=5654 protocol=https
2021-12-06T16:23:09.266849+00:00 heroku[router]: at=info method=GET path="/manifest.json" host=secret-hollows-83101.herokuapp.com request_id=caf86d2e-edaa-4c25-9519-2c9fbed3560d fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=269 protocol=https
2021-12-06T16:23:09.273012+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css" host=secret-hollows-83101.herokuapp.com request_id=aa61a279-1568-4bb7-b010-65495be2836f fwd="130.75.173.103" dyno=web.1 connect=0ms service=1ms status=304 bytes=270 protocol=https
2021-12-06T16:23:09.536458+00:00 heroku[router]: at=info method=GET path="/static/js/2.2d58c30e.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=468a24e6-ddb3-4bc6-837e-2abce96bc121 fwd="130.75.173.103" dyno=web.1 connect=0ms service=11ms status=200 bytes=1679857 protocol=https
2021-12-06T16:23:09.536747+00:00 heroku[router]: at=info method=GET path="/static/js/main.b96b77fa.chunk.js.map" host=secret-hollows-83101.herokuapp.com request_id=53d091a3-06a4-4d91-aa7c-c06af1e523f5 fwd="130.75.173.103" dyno=web.1 connect=1ms service=6ms status=200 bytes=73472 protocol=https
2021-12-06T16:23:09.570000+00:00 heroku[router]: at=info method=GET path="/static/css/main.950fff6a.chunk.css.map" host=secret-hollows-83101.herokuapp.com request_id=bd3d9ad3-e46f-4762-9fad-3480c9b7d071 fwd="130.75.173.103" dyno=web.1 connect=0ms service=2ms status=200 bytes=70364 protocol=https
您正在尝试获得 "cartItems" || "[]"，它总是会给您 cartItems。因此，如果 localStorage 中没有任何内容，则此表达式将为 null:
const cartFromLocal = JSON.parse(localStorage.getItem("cartItems" || "[]"));
可以修复，例如，像这样：
const cartFromLocal = JSON.parse(localStorage.getItem("cartItems")) || [];