我在将我的React项目部署到Netlify时遇到了一个问题,说我的profile-info视图中的editUserInfo函数没有定义。此外,我正在使用React-Router来切换项目中的视图。这在开发中非常有效,我的所有链接都工作正常,直到我尝试访问配置文件视图。除此之外,现场部署没有任何问题。
下面是我的个人资料视图的代码:
import React, { useEffect, useState } from "react";
import axios from "axios";
import UserInfo from "./user-info";
import { Col } from "react-bootstrap";
import MovieReelSpinner from "../MovieReelSpinner/MovieReelSpinner";
import InfoForm from "../form/info-form";
import FavoriteMovies from "./favorite-movies";
import DeleteModal from "./delete-modal";
import { URL } from "../../helpers/helpers";
import { useSelector, useDispatch } from "react-redux";
import { setUser, removeFromFavs } from "../../redux/features/userSlice";
import "../../styles/_profile-view.scss";
const ProfileView = ({ movies }) => {
const favoriteMovies = useSelector(
(state) => state.user.value.FavoriteMovies,
);
const userValues = useSelector((state) => state.user.value);
const [show, setShow] = useState("");
const token = localStorage.getItem("token");
const user = localStorage.getItem("user");
const dispatch = useDispatch();
useEffect(() => {
axios
.get(`${URL}/users/${user}`, {
headers: { Authorization: `Bearer ${token}` },
})
.then((res) => {
const {
Username,
Password,
Email,
Birthday,
FavoriteMovies,
} = res.data;
dispatch(
setUser({
Username,
Password,
Email,
Birthday: Birthday.slice(0, 10),
FavoriteMovies: movies.filter((movie) =>
FavoriteMovies.includes(movie._id),
),
}),
);
})
.catch((err) => console.log(err));
}, []);
editUserInfo = ({ username, password, email, birthday }) => {
axios
.put(
`${URL}/users/update/${user}`,
{
Username: username,
Password: password,
Email: email,
Birthday: birthday,
},
{
headers: { Authorization: `Bearer ${token}` },
},
)
.then((res) => {
localStorage.setItem("user", username);
dispatch(
setUser({
Username: username,
Password: password,
Email: email,
Birthday: birthday,
}),
);
alert(`${username} has been updated!`);
})
.catch((err) => console.log(err));
};
removeFromFavorites = (id) => {
axios
.delete(`${URL}/users/${user}/movies/${id}`, {
headers: { Authorization: `Bearer ${token}` },
})
.then((res) => dispatch(removeFromFavs(favoriteMovies.indexOf(id))))
.catch((err) => console.log(err));
};
deleteUser = () => {
axios
.delete(`${URL}/users/${user}`, {
headers: { Authorization: `Bearer ${token}` },
})
.then((res) => {
alert(`${user} has been deleted`);
localStorage.removeItem("user");
localStorage.removeItem("token");
window.open("/", "_self");
});
setShow("");
};
if (show === "update")
return <InfoForm editUserInfo={editUserInfo} setShow={setShow} />;
return (
<Col>
<UserInfo
user={userValues.Username}
email={userValues.Email}
birthday={userValues.Birthday}
setShow={setShow}
/>
<DeleteModal show={show} setShow={setShow} deleteUser={deleteUser} />
{favoriteMovies ? (
<FavoriteMovies
favoriteMovies={favoriteMovies}
removeFromFavorites={removeFromFavorites}
/>
) : (
<MovieReelSpinner />
)}
</Col>
);
};
export default ProfileView;
参考错误:
ReferenceError: editUserInfo is not defined
at Ay (profile-view.jsx:39)
at bi (react-dom.production.min.js:157)
at is (react-dom.production.min.js:267)
at Bs (react-dom.production.min.js:250)
at $s (react-dom.production.min.js:250)
at Us (react-dom.production.min.js:250)
at Fs (react-dom.production.min.js:243)
at react-dom.production.min.js:123
at b (scheduler.production.min.js:18)
at aa (react-dom.production.min.js:122)
任何帮助将不胜感激!
3条答案
按热度按时间myzjeezk1#
Netlify的一些优化过程可能会删除
editUserInfo =
,因为它会被分配给一个全局变量,因为它缺少var
/let
/const
。尝试将其更改为
const editUserInfo = ...
,看看是否有帮助。5uzkadbs2#
尝试在所有函数声明中添加const/let/var
bbuxkriu3#
对于在Netlify中构建时遇到
ReferenceError: location is not defined
问题的任何人,最终都会出现这个SO问题:仔细检查build命令是否在本地计算机上正确运行:
npm run build
或类似。运行npm run dev
时,我遇到了一个不可见的问题,但当我尝试npm run build
时,我得到了与Netlify相同的错误。