我如何让它在 React Native ( Logic ) 中工作

Question

抱歉含糊不清，我是 react-native 的初学者，不到一周前就开始学习它。我没有收到错误，但我基本上希望当我按下开始时它会完成所有锻炼并告诉你有多少次代表，并让你每次按下按钮时删除 1 组。但问题是由于某种原因，锻炼和虚拟锻炼之间的关系很奇怪。什么都有帮助！例如当

dummyWorkouts is [
{Object},
{Object}
]
workouts is [
{Object},
{Object},
{Object},
{Object}
]

但是对于默认设置，我认为将 dummyWorkouts 设置为锻炼时会出现问题。如果有更好的方法来做到这一点，那将是非常有帮助的另一个大问题是，当它逐个浏览锻炼列表时。将其限制为 2。

具体如下

setCurrentSets(currentSets-1)
if(currentSets == 1){
   if(dummyWorkouts.length > 1){
        setCurrentWorkout(dummyWorkouts[1])
        setCurrentSets(dummyWorkouts[1].sets)
        var index = dummyWorkouts.indexOf(dummyWorkouts[0])
        setDummyWorkouts(dummyWorkouts.splice(index, 1))
     }else{
        setDummyWorkouts(workouts)
        setCurrentWorkout(workouts[0])
        setCurrentSets(workouts[0].sets)
        setWorkout(false)
   }
}

import React, { useState } from 'react';
import { StyleSheet, Text, View, FlatList, Alert, Button } from 'react-native';
import Header from './components/header';
import Workouts from './components/workouts';
import AddWorkout from './components/addWorkout';

export default function App() {
  const [workout, setWorkout] = useState(false);

  const [workouts, setWorkouts] = useState([
    { name: 'Pushups', key: '1', sets: '3', reps: '20' },
    { name: 'Test', key: '2', sets: '3', reps: '20' },
  ]);

  const [currentWorkout, setCurrentWorkout] = useState(workouts[0]);
  const [currentSets, setCurrentSets] = useState(3)
  const [dummyWorkouts, setDummyWorkouts] = useState();

  const pressHandler = (key) => {
    setWorkouts((prevWorkouts) => {
      return prevWorkouts.filter(workout => workout.key != key);
    })
  }

  const submitHandler = (text) => {
    if(text.length > 0){
      if(text.length <= 40){
        setWorkouts((workouts) => {
        return [
          { name: text, key: Math.random().toString(), reps: '10', sets: '3' },
          ...workouts
        ]
    })
      }else {Alert.alert('Whoops!', "You entered over 40 characters! Shorten it up a bit!", [{text: 'Close '}])}
    }else {Alert.alert('Whoops!', "You haven't entered anything!", [{text: 'Close '}])}
  }

  if(workout == false){
  return (
    <View style={styles.container}>
      <Header />
      <View style={styles.WorkoutButton}>
        <Button
          title='START'
          color='white'
          onPress={()=>{
            if(workouts.includes(workouts[0])){
              setDummyWorkouts([...workouts])
              setWorkout(true)
            }else{Alert.alert('Whoops!', "No workouts detected!", [{text: 'Close '}])}
          }}
        />
      </View>
      <View style={styles.content}>
        <AddWorkout submitHandler={(val) => {submitHandler}}/>
        <View style={styles.list}> 
          <FlatList 
            data={workouts}
            renderItem={({ item }) => (
              <Workouts item={item} pressHandler={pressHandler} />
            )}
          />
        </View>
      </View>
    </View>
  );}else if (workout == true  && workouts.includes(workouts[0])){
    return(
    <View style={styles.container}>
      <Header />
      <View style={styles.WorkoutButton}>
        <Button
          title='-'
          color='white'
          onPress={() => {
            setCurrentSets(currentSets-1)
            if(currentSets == 1){
              if(dummyWorkouts.length > 1){

                setCurrentWorkout(dummyWorkouts[1])
                setCurrentSets(dummyWorkouts[1].sets)
                var index = dummyWorkouts.indexOf(dummyWorkouts[0])
                setDummyWorkouts(dummyWorkouts.splice(index, 1)) //delete workout
              }else{
                setDummyWorkouts(workouts)
                setCurrentWorkout(workouts[0])
                setCurrentSets(workouts[0].sets)
                setWorkout(false)
              }
            }
          }}
        />
      </View>
      <View style={styles.WorkoutCard}>
        <Text style={styles.Workout}>
          {currentWorkout.name}
        </Text>
        <Text style={styles.Sets}>
          Sets Left
          {'\n'}
          {currentSets}
        </Text>
        <Text style={styles.Reps}>
          Reps
          {'\n'}
          {currentWorkout.reps}
        </Text>
      </View>
    </View>
    );}else{
        setWorkout(false)
        Alert.alert('Whoops!', "No workouts detected!", [{text: 'Close '}])
      }
}

//Style Sheet

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#3B3B3B',
  },
  content: {
    padding: 60,
    flex: 1,
  },
  list: {
    marginTop: 20,
    flex:1,
  },
  text: {
    color: 'white',

  },
  WorkoutButton: {
    backgroundColor: 'black',
    left: 140,
    bottom: 52,
    marginHorizontal: 150,
    borderRadius: 15,
    fontWeight: 'bold',
  },
  WorkoutCard: {
    backgroundColor: 'crimson',
    height: 600,
    width: 300,
    marginTop: 50,
    alignSelf: 'center',
    borderRadius: 50,
  },
  Workout: {
    fontSize: 50,
    fontWeight: '600',
    color: 'white',
    textAlign: 'center',
  },
  Sets: {
    fontSize: 50,
    fontWeight: '400',
    color: 'white',
    textAlign: 'center',
    top: 30,
  },
  Reps: {
    fontSize: 40,
    fontWeight: '400',
    color: 'white',
    textAlign: 'center',
    top: 50,
  },
});```

Answer 1

这个项目后来被放弃了，手头的问题是复制 dummyWorkouts（一个数组）。它必须做一些我觉得比我的编程更低端的事情，而且这仍然超出了我的专长。