我想更新用户数据。我成功获取现有用户数据,但没有更新。显示以上错误。 当我从下面一行删除一个等号时,错误将被删除,但用户数据仍然没有更新。
const existingUser = users.userList.filter(f => f.id == id);
import React, { useState } from 'react'
import { useSelector, useDispatch } from 'react-redux';
import { useNavigate, useParams } from 'react-router-dom';
import { updateUser } from '../redux/slice/userReducer';
const Update = () => {
const { id } = useParams();
//console.log(id)
const users = useSelector((state) => state.users);
const existingUser = users.userList.filter(f => f.id === id);
//console.log(existingUser);
const { name, email } = existingUser[0];
const [uname, setName] = useState(name);
const [uemail, setEmail] = useState(email);
const dispatch = useDispatch();
const navigate = useNavigate();
const handleUpdate = (event) => {
event.preventDefault();
dispatch(updateUser({
id: id,
name: name,
email: email
}));
navigate('/');
}
return (
Update User
)
}
export default Update
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
我不确定您的数据结构是什么,但从提供的代码我可以解释并猜测问题是什么。
您收到的错误意味着您的
existingUser的第 0 个元素不存在。由于existingUser来自过滤器并且过滤器返回一个数组,因此我们可以假设过滤器内的条件不满足任何元素。当您说将
===更改为==会使其正常工作时,我们可以猜测 f.id 和 id 不是同一类型。也许一个是字符串,另一个是整数。使用 == 实际上解决了您最初的问题。但如果您想使用 === 您可以尝试更改值的类型。例如,如果 id 是字符串,f.id 是整数,则可以这样编写条件:
您可以通过 Google 搜索了解它们的差异。
您的下一个问题是,修复上述错误后,数据未更新。这是因为您在组件中使用的设计模式。 useState 仅采用一个初始值,并且在整个组件生命周期中不会更改,除非您使用
setState更新它。由于您正在使用 useSelector 和调度,我假设您正在使用
redux。在这种情况下,我认为不需要useState。您只需使用从existingUser[0]中解构的名称和电子邮件,只要您发送更新,它们就会呈现代码>.