在自定义对象的本机打字稿中搜索过滤器完成后无法分配数据

Question

我有一个自定义对象数组并在其中存储 api 响应并将该数据显示到 UI 中以用于 flatlist。

export type userInfo = {
  id: string,
  title: string,
  email: string,
  userAccount: number
};

export type userData = {
  page: number,
  pageSize: number,
  userInformation: userInfo[]
}

export const User: FunctionComponent = () => {

       const [search, setSearch] = useState('');
      const [userInfo, setUserInfo] = useState<userInfo>();
  
      const [arrayholder, setArrayholder] =useState<userInfo>();

      useEffect(() => {
          setUserInfo(someState.userInfo);
          setArrayholder(someState.userInfo);
      }, [someState]);

searchData= (text: any)=>  {
            const newData = arrayholder?.userData.filter(item => {
                const itemData = item.title.toUpperCase();
                const textData = text.toUpperCase();
                return itemData.indexOf(textData) > -1
              });
              console.log("newData is", newData) //here throwing error
              setUserInfo(newData)
                setSearch(text)    
              }

}

          return (

//here showing searchbar
//here showing flatlist showing with userInfo

)

尝试为 userInfo 设置新数据时，出现以下错误并且无法在 flatlist 中显示搜索数据。

  Type 'userInfo[]' provides no match for the signature '(prevState: userInfo | undefined): userData | undefined'.ts(2345)

有什么建议吗？

我是 typescript 语言的新手。

Answer 1

filter return 一个数组：

arrayholder?.activities.filter

这就是 userInfo 需要数组类型参数的原因。

const [userInfo, setUserInfo] = useState<userInfo[]>();

在自定义对象的本机打字稿中搜索过滤器完成后无法分配数据

Unable to assign data after search filter completes in react native typescript for custom object

typescript

react-native

react-native-flatlist

searchbar

flatlist