React Native Props Yardım Lütfen.

Merhabalar;


React native ile iç içe liste oluşturmaya çalışıyorum. Switch case:1 yapısı içerisinde ListComponents data'yı props olarak gönderip ListComponents.js doyasına, listeye basmak istiyorum. Verileri chessListData.js dosyasından alıyor. Bu konuda yorumda bulunabilecek arkadaşlar var mı. ? Teşekkürler.

import { StackNavigator } from 'react-navigation';
import ListComponents from './src/components/ListComponents';
import chessListData from './src/components/chessListData';

import opening from "./opening_List.json";

class SecondActivity extends Component
  {
    static navigationOptions =
    {
       title: 'SecondActivity',
    };

    render()
    {

      switch (this.props.navigation.state.params.deneme) {
        case 1:
          return (
            <View>
<ListComponents  data={this.alapinData}/>
</View>
            );
        case 2:
          return (
            <View style={styles.lvl2}>
<Text>İki</Text>


</View>
            );
        case 3:
          return (
            <View style={styles.lvl2}>
<Text>üç</Text>

</View>
            );
        case 4:
          return (
            <View style={styles.lvl2}>
<Text>dört</Text>


</View>
            );
        default:
          return (
            <View style={styles.lvl2}>
<Text>Null</Text>
</View>
            );
        }

importReact, { Component } from"react";
import {View, Text, FlatList, ActivityIndicator} from "react-native";
import { List, ListItem, SearchBar } from "react-native-elements";


class ListComponents extends Component {
    constructor(props) {

      super(props);

      this.state = {
        loading: false,
        data: [],
        page: 1,
        seed: 1,
        error: null,
        refreshing: false
      };
    }
   
    componentDidMount() {
   
    }

    renderSeparator = () => {
      return (
        <View
        style={{
            height: 1,
            width: "98%",
            backgroundColor: "#CED0CE",
            marginLeft: "2%"
          }}
/>
      );
    };

    renderHeader = () => {
      return <SearchBar placeholder="Type Here..." lightTheme round />;
    };

    renderFooter = () => {
      if (!this.state.loading) return null;

      return (
        <View
        style={{
            paddingVertical: 20,
            borderTopWidth: 1,
            borderColor: "#CED0CE"
          }}
>
<ActivityIndicator animating size="large"/>
</View>
      );
    };

      render()  {
      
          return (
          
          <List containerStyle={{ borderTopWidth: 0, borderBottomWidth: 0 }}>
<FlatList
            data={this.props.data}
            renderItem={({ item }) => (
              <ListItem
                roundAvatar
                title={`${item.name}`}
                subtitle={item.code}
//avatar={{ uri:  item.picture.chessLogo }}
                containerStyle={{ borderBottomWidth: 0 }}
//onPress = { this.OpenSecondActivityFunction.bind(this, item.uid) } 
/>
              )}
            keyExtractor={item => item.code}
            ItemSeparatorComponent={this.renderSeparator}
            ListHeaderComponent={this.renderHeader}
            ListFooterComponent={this.renderFooter}
/>
</List>
          );
      }
    }

export default ListComponents;

letalapinData= [
    { name:'Trap #1',code: 't3qavi2z',number:'996660',klasorno:'10808'},
      { name: 'Trap #2',code: 'm66amdc',number:'996661', klasorno:'10808'},
      { name: 'Trap #3',code: 'qleezfxj',number:'996663',klasorno:'10808'},
      { name: 'Trap #4',code: 'a0bkmltn',number:'996664',klasorno:'10808'},
      { name: 'Trap #5',code: 'wnqu77b8',number:'996665',klasorno:'10808'},
      { name: 'Trap #6',code: 'upxc4phv',number:'996666',klasorno:'10808'}
    

];

Not: Sorun aşağıdaki kod eklenerek çözüldü.

import {alapinCtrl,alekhineCtrl} from'./src/components/chessListData';