Javascript 类型为'的参数；承诺<；项目|未定义>；[]和#x27；不可分配给类型为'；设置状态动作<；第[]项>'；

我还没有反应过来。我想创建一个函数，使用ID列表从Firebase调用items数据

我使用TypeScript、React Native和Hooks

我尝试以下代码：

const FavoritesScreen = () => {
  const [favoritesData, setFavoritesData] = useState<Array<Item>>([])

  useEffect(() => {
    init()
  }, [])

  const init = async () => {
    const data = await getFavorites(sortByTimeStamp)
    setFavoritesData(data)
  }

  // ...

const-favoritescreen=（）=>{
常量[favoritesData，setFavoritesData]=useState（[]）
useffect（（）=>{
init（）
}, [])
const init=async（）=>{
常量数据=等待getFavorites（sortByTimeStamp）
setFavoritesData（数据）
}
// ...

有人建议我在使用async/await时，将init函数的声明从useEffect钩子中去掉。到目前为止，它还在工作

getFavorites使用async声明，因为它需要等待来自Firebase的数据

Visual Studio在setFavorites（数据）中的单词data下面加下划线，并添加以下注释：

const data: Promise<Item | undefined>[]
Argument of type 'Promise<Item | undefined>[]' is not assignable to parameter of type 'SetStateAction<Item[]>'.
  Type 'Promise<Item | undefined>[]' is not assignable to type 'Item[]'.
    Type 'Promise<Item | undefined>' is missing the following properties from type 'Item': author, authorName, authorTitle, benefits, and 13 more.ts(2345)

const数据：Promise[]
“Promise[]”类型的参数不能分配给“SetStateAction”类型的参数。
类型“承诺[]”不可分配给类型“项目[]”。
类型“Promise”缺少类型“Item”中的以下属性：author、authorName、authorTitle、benefits和其他13个属性。ts（2345）

我不清楚问题是承诺还是未定义，也不清楚如何解决

以下是完整的代码（如果有帮助）：

import React, { useEffect, useState, useContext } from 'react'
import { Text, SafeAreaView, StyleSheet } from 'react-native'
import colors from '../constants/colors'
import { FirebaseContext, FavoritesContext } from 'src/firebase'
import { Item } from '../types/item'
import { Timestamp } from '@firebase/firestore-types'

type CompareFunction = (a: [string, Timestamp], b: [string, Timestamp]) => number

const FavoritesScreen = () => {
  const { firebase } = useContext(FirebaseContext)
  const { favorites } = useContext(FavoritesContext)
  const [favoritesData, setFavoritesData] = useState<Array<Item>>([])

  useEffect(() => {
    init()
  }, [])

  const init = async () => {
    // call the functions used in useEffect
    const data = await getFavorites(sortByTimeStamp)
    setFavoritesData(data)
  }

  // This function gets Firestore data for one id
  const getItemDataFromId = async (id: string) => {
    try {
      const data: Item = await firebase.db.collection('content').doc(id).get().data()
      return data
    } catch (error) {
      console.log(`Could not get Firebase data from Id: ${id}. Error message: ${error}`)
    }
  }

  // this function compare the timestamps for use in the Array.prototype.sort() method.
  function sortByTimeStamp(a: [string, Timestamp], b: [string, Timestamp]) {
    let am = 1
    let bm = 1
    try {
      const am = a[1].toMillis()
    } catch {
      return -1
    }
    try {
      const bm = b[1].toMillis()
    } catch {
      return 1
    }
    return am - bm
  }

  // Create an array of items data from the favorites object, sorted ny timestamp
  const getFavorites = async (compareFunction?: CompareFunction) => {
    // Convert the object to a [[key1, value1],[key2,value2],...) array
    const favoritesArray = Object.entries(favorites)
    // sort if needed
    compareFunction && favoritesArray.sort(compareFunction)
    // get the data from firebase
    const items = favoritesArray.map(async ([key, value]) => await getItemDataFromId(key))
    return items
  }

  return (
    <SafeAreaView style={styles.container}>
      <Text>Work in progress</Text>
    </SafeAreaView>
  )
}

//// Styles ////
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: colors.background,
    justifyContent: 'center',
    alignItems: 'center',
  },
})

export default FavoritesScreen

import React，{useffect，useState，useContext}来自“React”
从“react native”导入{Text，SafeAreaView，StyleSheet}
从“../constants/colors”导入颜色
从'src/firebase'导入{FirebaseContext，FavoritesContext}
从“../types/Item”导入{Item}
从'@firebase/firestore-types'导入{Timestamp}
类型CompareFunction=（a:[字符串，时间戳]，b:[字符串，时间戳]=>number
常量FavoriteScreen=（）=>{
const{firebase}=useContext（FirebaseContext）
const{favorites}=useContext（FavoritesContext）
常量[favoritesData，setFavoritesData]=useState（[]）
useffect（（）=>{
init（）
}, [])
const init=async（）=>{
//调用useffect中使用的函数
常量数据=等待getFavorites（sortByTimeStamp）
setFavoritesData（数据）
}
//此函数用于获取一个id的Firestore数据
const getItemDataFromId=async（id:string）=>{
试一试{
常量数据：Item=await firebase.db.collection（'content'）.doc（id）.get（）.data（）
返回数据
}捕获（错误）{
log（`无法从Id:${Id}获取Firebase数据。错误消息：${Error}`）
}
}
//此函数用于比较Array.prototype.sort（）方法中使用的时间戳。
函数sortByTimeStamp（a:[字符串，时间戳]，b:[字符串，时间戳]）{
设am=1
设bm=1
试一试{
常量am=a[1].toMillis（）
}抓住{
返回-1
}
试一试{
常量bm=b[1]。toMillis（）
}抓住{
返回1
}
返回am-bm
}
//从favorites对象中创建项目数据数组，按ny时间戳排序
const getFavorites=async（compareFunction？：compareFunction）=>{
//将对象转换为[[key1，value1]，[key2，value2]，…）数组
常量favoritesArray=Object.entries（收藏夹）
//如果需要，进行排序
compareFunction&&favoritesArray.sort（compareFunction）
//从firebase获取数据
const items=favoritesArray.map（异步（[key，value]）=>Wait getItemDataFromId（key））
退货项目
}
返回(
正在进行的工作
)
}
////风格////
const styles=StyleSheet.create({
容器：{
弹性：1，
背景颜色：colors.background，
为内容辩护：“中心”，
对齐项目：“居中”，
},
})
导出默认收藏夹屏幕

您可能遇到的第一个问题是在

map

函数中处理异步项。这将返回解析为

项

的承诺数组，而不是

项

元素数组

一个简单的解决方法是把它包起来

const items=favoritesArray.map（异步（[key，value]）=>wait-getItemDataFromId（key））；
退货承诺。全部（项目）；

但是，在此之后，您可能会遇到返回类型为

Array

的问题，而不仅仅是

Array

。有几种方法可以解决此问题。可以将

items

值转换为

Item[]

，但可能最好过滤掉未定义的值。为此，我建议查找。例如：

items.filter（（x）：x是Item=>x！==未定义）；

您可能遇到的第一个问题是在

map

函数中处理异步项。这将返回解析为

项

的承诺数组，而不是

项

元素数组

一个简单的解决方法是把它包起来

const items=favoritesArray.map（异步（[key，value]）=>wait-getItemDataFromId（key））；
退货承诺。全部（项目）；

但是，在此之后，您可能会遇到返回类型为

Array

的问题，而不仅仅是

Array

。有几种方法可以解决此问题。可以将

items

值转换为

Item[]

，但可能最好过滤掉未定义的值。为此，我建议查找。例如：

items.filter（（x）：x是Item=>x！==未定义）；

谢谢。现在一切都好了！谢谢。现在一切都好了！