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
有什么建议吗?谢谢你
1条答案
按热度按时间xtupzzrd1#
在我看来是正确的。您能否验证是否定义了item.id,并将handleDelete更新为如下所示?
然后更新按钮组件