reactjs FirebaseError故障排除:应为类型“_h”,但它是:自定义FirestoreQuery对象

ipakzgxi  于 12个月前  发布在  React
关注(0)|答案(1)|浏览(57)
export default function Todo() {

    const navigation = useNavigation();
    const { user } = useAuth();

    const query = firestore()
        .collection("todos")
        .where("userId", "==", user?.uid)
        .orderBy("createdAt", "desc");

    const [data, loading] = useCollectionData(query, { idField: "id" });

    const handleDelete = item => e => {
        Alert.alert('Delete Confirmation', 'Are you sure want to delete this todo?', [
            {
                text: 'Cancel',
                onPress: () => { },
                style: 'cancel',
            },
            {
                text: 'Yes', onPress: async () => {

                    await firestore().collection("todos").doc(item.id).delete();

                }
            },
        ]);

    }


    return <SafeAreaView style={styles.container}>
    
        <Appbar>
            <Appbar.Content title="Your To-do" />
        </Appbar>
        
        {loading ?
            <View style={styles.loading}>
                <ActivityIndicator />
            </View>
            :
        
            <FlatList
                data={data}
                renderItem={({ item }) => {
                    const { title, description } = item;
                    return <List.Item
                        left={props => <List.Icon {...props} icon="checkbox-blank-circle" />}
                        title={title}
                        description={description}
                        right={props => <View {...props}>
                            <View style={styles.actionBtns}>
                                <IconButton onPress={() => navigation.navigate("ToDoForm", {
                                    mode: "update",
                                    item
                                })} icon="pencil" />
                                <IconButton
                                    onPress={handleDelete(item)}
                                    icon="delete" />
                            
                            </View>
                        </View>}
                    />
                }}
            />} 

        <FAB
            onPress={() => navigation.navigate("ToDoForm", { mode: "create" })}
            style={styles.fab}
            icon={"plus"}
        />
    </SafeAreaView>

}

我试着用react native firebase做了一个待办事项列表。它定义了一个Firestore查询来检索与当前登录用户关联的to-do项。查询根据userId字段过滤todos集合,并按createdAt降序排列结果。useCollectionData钩子用于订阅Firestore查询并检索数据。它返回数据和一个加载指示符。handleDelete函数被定义来处理待办事项的删除。它会显示一个确认删除的警报,并在确认后从Firestore中删除该项目。但我得到这个错误信息

FirebaseError: Expected type '_h', but it was: a custom FirestoreQuery object

有什么建议吗?谢谢你

xtupzzrd

xtupzzrd1#

在我看来是正确的。您能否验证是否定义了item.id,并将handleDelete更新为如下所示?

const handleDelete = item => {
        console.log(item.id); // Check item.id value

        Alert.alert('Delete Confirmation', 'Are you sure want to delete this todo?', [
            {
                text: 'Cancel',
                onPress: () => { },
                style: 'cancel',
            },
            {
                text: 'Yes', onPress: async () => {
                    if (item.id)
                       await firestore().collection("todos").doc(item.id).delete();
                }
            },
        ]);

    }

然后更新按钮组件

<IconButton
  onPress={() => handleDelete(item)}
  icon="delete" 
/>

相关问题