複数のコンポーネントをレンダリングしようとすると、React Native レンダリング エラーが発生します
<p>ユーザーが [追加] ボタンを押した後に構築された同じカスタム コンポーネントの複数のコピーをレンダリングしたいと考えています。私のコードは次のとおりです: </p>
<pre class="brush:php;toolbar:false;">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';
'./Lift' からリフトをインポート
デフォルト関数 Lifts() をエクスポート {
// const [cards, setCards] = useState([{ id: uuidv4() }])
// const onPress = () => setCards([...cards, [{ id: uuidv4() }]])
const [カード, setCards] = useState([uuidv4()])
const onPress = () => setCards([...cards, uuidv4()])
constliftCards =cards.map((id) => {
戻る （
<キー={id}を表示>
<リフト />
</表示>
)
})
戻る （
<見る>
<TouchableHighlight onPress={onPress} underlayColor={'#DDDDDD'} style={styles.touchable}>
<スタイル={styles.button}を表示>
<テキスト>
リフトの追加
</テキスト>
</表示>
</TouchableHighlight>
{/* <Text style={{ alignSelf: 'center', top: 100 }}>
{カード}
</テキスト> */}
{
カード.マップ((データ, ID) => {
戻る （
<テキスト> {id} </テキスト>
)
})
}
</表示>
)
}
const スタイル = StyleSheet.create({
ボタン： {
alignItems: '中心',
境界幅: 2、
境界線の色: '黒'、
境界半径: 10、
パディング: 10、
}、
タッチ可能: {
余白水平: 10、
トップ10
}
})</pre>
上のスニペットの <p> は、画面に表示したいカスタム コンポーネントです。私が抱えている問題は、「ブーストの追加」を数回クリックすると、「未定義は関数ではありません」というエラー メッセージが表示されることです。私が得た言葉：</p>
<pre class="brush:php;toolbar:false;">エラー TypeError: 未定義は関数ではありません
このエラーは次の場所にあります。
リフト内 (SceneView によって作成)
静的コンテナ内
EnsureSingleNavigator (SceneView によって作成)
SceneView 内 (SceneView によって作成)
RCTView 内 (View によって作成)
View 内 (DebugContainer によって作成)
DebugContainer (MaybeNestedStack によって作成)
メイビーネストスタック内 (SceneView によって作成)
RCTView 内 (View によって作成)
ビュー内 (SceneView によって作成)
RNSScreen 内 (AnimatedComponent によって作成)
アニメーションコンポーネント内
AnimatedComponentWrapper 内 (InnerScreen によって作成)
サスペンダー（フリーズ作成）
サスペンス中 (フリーズ作成)
in Freeze (DelayedFreeze によって作成)
DelayedFreeze 内 (InnerScreen によって作成)
InnerScreen (Screen によって作成)
画面内 (SceneView で作成)
SceneView 内 (NativeStackViewInner によって作成)
サスペンダー（フリーズ作成）
サスペンス中 (フリーズ作成)
in Freeze (DelayedFreeze によって作成)
DelayedFreeze 内 (ScreenStack によって作成)
RNSScreenStack (ScreenStack によって作成) 内
ScreenStack 内 (NativeStackViewInner によって作成)
NativeStackViewInner 内 (NativeStackView によって作成)
RNCSafeAreaProvider 内 (SafeAreaProvider によって作成)
SafeAreaProvider 内 (SafeAreaInsetsContext によって作成)
SafeAreaProviderCompat 内 (NativeStackView によって作成)
NativeStackView 内 (NativeStackNavigator によって作成)
PreventRemoveProvider 内 (NavigationContent によって作成)
ナビゲーションコンテンツ内
不明 (NativeStackNavigator によって作成)
NativeStackNavigator内（アプリで作成）
EnsureSingleNavigator で
BaseNavigationContainer 内
テーマプロバイダー内
NavigationContainerInner 内 (アプリによって作成)
アプリ内 (withDevTools(App) によって作成)
withDevTools(アプリ)
RCTView 内 (View によって作成)
ビュー内 (AppContainer によって作成)
RCTView 内 (View によって作成)
ビュー内 (AppContainer によって作成)
AppContainer内
main(RootComponent)、JS エンジン内: hermes</pre>
<p>我相当信心问题出在我对 <code>uuidv4()</code>機能の使用上、完全に同じ番号を使用していますが、印刷される シート の長さの場合は、ID 番号として uuidv4() ではなく 1、2、3... のみを使用します。 </コード> uuidv4() を使用して、毎回正しい数字と正しい量を出力することもできます。同じ結果が得られ、<code<Lift/></code> <code>カード</code></p>の枚数の長さの一致＞
<p>编辑：私はいくつかの私からの移動デバイス上で見られる错误画面截図を提供しています
モバイル デバイス上のセキュリティー メッセージ モバイル デバイス上のセキュリティー メッセージが続いています。
