我创建了一个删除钩子来分别删除屏幕上的某些数据,但是每次加载该钩子时,它都会删除页面上的所有条目。我试图能够单击一个图标并删除一个项目。我正在通过道具传递商品的ID,然后调用我的delete函数,但不是等待用户输入,钩子会删除数据库中的所有内容。任何帮助表示赞赏。
挂钩
import { useContext } from 'react';
import { Context as CertificationContext } from '../context/CertificationContext';
import { Context as CertificateInfoContext } from '../context/CertificateInfoContext';
export default () => {
const { deleteCertification } = useContext(CertificationContext);
const {
state: { certificationId }
} = useContext(CertificateInfoContext);
console.log('Delete' + certificationId);
const removeCertification = async id => {
await deleteCertification(id);
};
return removeCertification;
};
组件
import { View, Text, StyleSheet } from 'react-native';
import { Button } from 'react-native-elements';
import Icon from 'react-native-vector-icons/Feather';
import { navigate } from '../navigationRef';
import useDeleteCertification from '../hooks/useDeleteCertification';
const Certifications = ({ title, month, description, id }) => {
const removeCertification = useDeleteCertification();
return (
<View style={styles.mainContainer}>
<View style={styles.firstContainer}>
<Text style={styles.monthText}>{month}</Text>
<Text style={styles.dayText}>FRI</Text>
</View>
<View style={styles.secondContainer}>
<Text style={styles.title}>{title}</Text>
<Text style={styles.subtitle}>{description}</Text>
<View style={styles.buttonView}>
<Button
icon={<Icon name='trash-2' color='grey' size={15} />}
type='clear'
onPress={removeCertification(id)}
/>
<Button
icon={<Icon name='share' color='grey' size={15} />}
type='clear'
onPress={() => {
console.log('Share Button');
}}
/>
<Button
icon={<Icon name='edit' color='grey' size={15} />}
type='clear'
onPress={() => {
navigate('EditCertification', { id });
}}
/>
</View>
</View>
</View>
);
};
答案 0 :(得分:1)
在onPress
道具中使用箭头功能,如下所示:
<Button
icon={<Icon name='trash-2' color='grey' size={15} />}
type='clear'
onPress={() => removeCertification(id)}
/>
现在您传递的是函数而不是函数的结果,因此它不会在渲染时触发