我想呈现同一个自定义组件的多个副本，我在用户按下“添加”按钮后构建。代码如下：

import "react-native-get-random-values";
import { StyleSheet, TextInput, View, Text, TouchableHighlight, Button } from 'react-native';
import React, { useState } from 'react';
import { v4 as uuidv4 } from 'uuid';
import Lift from './Lift'

export default function Lifts() {
  // const [cards, setCards] = useState([{ id: uuidv4() }])
  // const onPress = () => setCards([...cards, [{ id: uuidv4() }]])
  const [cards, setCards] = useState([uuidv4()])
  const onPress = () => setCards([...cards, uuidv4()])

  const liftCards = cards.map((id) => {
    return (
      <View key={id}>
        <Lift />
      </View>
    )
  })

  return (
    <View>
      <TouchableHighlight onPress={onPress} underlayColor={'#DDDDDD'} style={styles.touchable}>
        <View style={styles.button}>
          <Text>
            Add Lift
          </Text>
        </View>
      </TouchableHighlight>
      {/* <Text style={{ alignSelf: 'center', top: 100 }}>
        {cards}
      </Text> */}
      {
        cards.map((data, id) => {
          return (
            <Text> {id} </Text>
          )
        })
      }
    </View>
  )
}

const styles = StyleSheet.create({
  button: {
    alignItems: 'center',
    borderWidth: 2,
    borderColor: 'black',
    borderRadius: 10,
    padding: 10,
  },
  touchable: {
    marginHorizontal: 10,
    top: 10
  }
})

字符串
在上面的代码片段中是我想要在屏幕上显示的自定义组件。我遇到的问题是，在我点击“添加Lift”几次后，我得到一个错误，说“undefined不是一个函数”。我得到的错误：

ERROR  TypeError: undefined is not a function

This error is located at:
    in Lifts (created by SceneView)
    in StaticContainer
    in EnsureSingleNavigator (created by SceneView)
    in SceneView (created by SceneView)
    in RCTView (created by View)
    in View (created by DebugContainer)
    in DebugContainer (created by MaybeNestedStack)
    in MaybeNestedStack (created by SceneView)
    in RCTView (created by View)
    in View (created by SceneView)
    in RNSScreen (created by AnimatedComponent)
    in AnimatedComponent
    in AnimatedComponentWrapper (created by InnerScreen)
    in Suspender (created by Freeze)
    in Suspense (created by Freeze)
    in Freeze (created by DelayedFreeze)
    in DelayedFreeze (created by InnerScreen)
    in InnerScreen (created by Screen)
    in Screen (created by SceneView)
    in SceneView (created by NativeStackViewInner)
    in Suspender (created by Freeze)
    in Suspense (created by Freeze)
    in Freeze (created by DelayedFreeze)
    in DelayedFreeze (created by ScreenStack)
    in RNSScreenStack (created by ScreenStack)
    in ScreenStack (created by NativeStackViewInner)
    in NativeStackViewInner (created by NativeStackView)
    in RNCSafeAreaProvider (created by SafeAreaProvider)
    in SafeAreaProvider (created by SafeAreaInsetsContext)
    in SafeAreaProviderCompat (created by NativeStackView)
    in NativeStackView (created by NativeStackNavigator)
    in PreventRemoveProvider (created by NavigationContent)
    in NavigationContent
    in Unknown (created by NativeStackNavigator)
    in NativeStackNavigator (created by App)
    in EnsureSingleNavigator
    in BaseNavigationContainer
    in ThemeProvider
    in NavigationContainerInner (created by App)
    in App (created by withDevTools(App))
    in withDevTools(App)
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent), js engine: hermes

型
我相当确信问题出在我对uuidv4()功能的使用上，因为当我使用完全相同的代码，但打印cards数组的长度时，只有1，2，3...作为ID号码而不是uuidv4()，它在每次按下时也输出正确的数字和正确的增量。我希望在使用uuidv4()和自定义<Lift />卡的数量来匹配cards的长度时得到相同的结果
编辑：我提供了一些屏幕截图的错误，从我的移动终端Error on mobile deviceError on mobile device continued