Javascript &引用;财产';名称';不存在于类型';决不;
当您在搜索框中键入匹配的name属性时,我试图在用户中搜索它,我只是粘贴了我认为相关的重要代码。当我返回user.name时,useEffect中发生错误 任何帮助都将不胜感激,我尝试记录用户,但它返回了一个空数组和2个用户对象数组,是否有方法访问单个数组,这可能是问题吗Javascript &引用;财产';名称';不存在于类型';决不;,javascript,reactjs,Javascript,Reactjs,当您在搜索框中键入匹配的name属性时,我试图在用户中搜索它,我只是粘贴了我认为相关的重要代码。当我返回user.name时,useEffect中发生错误 任何帮助都将不胜感激,我尝试记录用户,但它返回了一个空数组和2个用户对象数组,是否有方法访问单个数组,这可能是问题吗 返回( 用户数据库 添加用户 setSearch(e.target.value)} /> 搜寻 您是否在使用typescript?如果是,请尝试在使用用户的任何位置分配相关类型。是的,我在使用typescript,如何分配类
返回(
用户数据库
添加用户
setSearch(e.target.value)}
/>
搜寻
您是否在使用typescript?如果是,请尝试在使用用户的任何位置分配相关类型。是的,我在使用typescript,如何分配类型?
// Create AddUser component
export const AddUser = () => {
// Prepare states
const [name, setName] = useState("");
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [users, setUsers] = useState([]);
const [loading, setLoading] = useState(true);
const [show, setShow] = useState(false);
const [search, setSearch] = useState("");
const [filteredUsers, setFilteredUsers] = useState([]);
const handleClose = () => setShow(false);
const handleShow = () => setShow(true);
// Fetch all users on initial render
useEffect(() => {
fetchUsers();
}, []);
// Fetch all users
const fetchUsers = async () => {
// Send GET request to 'users/all' endpoint
axios
.get("http://localhost:8000/users/all")
.then((response) => {
// Update the users state
setUsers(response.data);
// Update loading state
setLoading(false);
})
.catch((error) =>
console.error(`There was an error retrieving the user list: ${error}`)
);
};
useEffect(() => {
setFilteredUsers(
users.filter((user) => {
return user.name.toLowerCase().includes(search.toLowerCase());
})
);
}, [search, users]);
return (
<div>
<Navbar bg="light" expand="lg">
<Navbar.Brand href="#home">User Database</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="mr-auto">
<Button variant="dark" onClick={handleShow}>
Add User
</Button>
</Nav>
<Form inline>
<FormControl
type="text"
placeholder="Search"
className="mr-sm-2"
onChange={(e) => setSearch(e.target.value)}
/>
<Button variant="outline-success">Search</Button>
</Form>
</Navbar.Collapse>
</Navbar>