类型错误：无法读取未定义的属性“包含”（从数据库中获取反应）

Question

我对这个函数有疑问，它与我创建的 dummydatabase.js 文件配合得很好，但是当我从数据库中获取时，它就停止工作了......我以为它没有正确获取，但它工作正常。我不明白为什么它不起作用......请帮忙并提前致谢！编辑：这是我得到的错误。如果我的问题不清楚，我很抱歉！^^;Edit2：这是整个页面的代码。import React, { useState, useEffect } from 'react';import SearchBox from '../components/SearchBox';//import Group from '../components/Group';import GroupList from '../components/Group/GroupList';//import './App.css';import { exportedgroups } from '../dummyGroups';function GroupBox() {    const [groups, setGroups] = useState([]);    const [searchfield, setSearchfield] = useState('');    useEffect(() => {        fetch('http://localhost:3000/groups/get_all_groups')            .then(response => response.json())            .then(groups => { setGroups(groups.data.groups);                console.log('GroupBox');                console.log(groups.data.groups)                console.log('exportedgroups');                console.log(exportedgroups);            });        // setGroups(exportedgroups);        // console.log("local data" + exportedgroups);        // const getAllGroups = async () => {        //     let groupData = await fetch('http://localhost:3000/groups/get_all_groups');        //     let groupList = await groupData.json();        //     setGroups(groupList.data.groups);        // }        // getAllGroups();    }, []);    console.log(groups);    const onSearchChange = (event) => {        setSearchfield(event.target.value);    }    const filteredGroups = groups.filter(group => {        console.log("FilteredGroup");        console.log(group);        return group.name.includes(searchfield);    });    return (        <div className='GroupBox'>            <div className='flex'>                <div className='flex flex-column'>                    <div className='flex justify-start fw1 f3'>                        Groups                        </div>

Answer 1

您的姓名字段值未定义。

试试这个，

const filteredGroups = groups.filter(group => {

    console.log("FilteredGroup");

    console.log(group);

    return group.name?.includes(searchfield); //adding "?" mark 

});