Question

我正在制作一个成绩计算器应用程序。我正在使用AsyncStorage在手机上本地存储“类”对象。当我在main.js屏幕上单击其中一门课程时，它将打开另一个名为courseDetails.js的屏幕。那里有一个删除按钮，可以按预期从存储对象的数组中删除对象。我的问题是，我希望我的删除按钮能够执行onPress={() => removeCourse(course.key)}和onPress={() => navigation.navigate('Home')，因此它删除了我的对象，并带我回到主屏幕，但是如何合并它们呢？它们都可以单独工作，但我不能同时使它们都工作。有关更多上下文，请参见我的removeCourse()函数：

const removeCourse = (courseKey) => {
    console.log('remove course')
    newCourses = courses.filter((course) => {
        return course.key != courseKey
    });
    
    setCourses(newCourses);

    save(newCourses);

这是courseDetails.js代码：

import React from 'react';
import {StyleSheet, View, Text, } from 'react-native';
import { globalStyles } from '../styles/global';
import DetailCard from '../shared/detailCard';
import DeleteButton from '../shared/deleteButton';


export default function CourseDetails({navigation}){
    let course = navigation.getParam('course')
    let removeCourse = navigation.getParam('removeCourse')

    return(
        <View style={globalStyles.container}>
            <DetailCard>
                <Text >{course.course}</Text>
                <Text >{course.prof}</Text>
                {/* <Text >{navigation.getParam('gpa')}</Text> */}
            </DetailCard>
            <DeleteButton text='Delete Course' onPress={() => navigation.navigate('Home')}/> //onPress in question
        </View>
    )
}

Answer 1

您是否尝试过将两个都合并到一个onPress回调中？

<DeleteButton text='Delete Course' onPress={() => {
    removeCourse(course.key);
    navigation.navigate('Home');
  }}/>

Answer 2

您可以使用useEffect并将课程作为依赖项包含在useEffect中。一旦课程中的某些内容被删除，useEffect就会被触发，在那里您可以指示做出反应以导航回您想要的位置。

如何结合这两个onPress功能？

2 个答案: