React-Native Flatlist не воспроизводится из-за какой-то ошибки - PullRequest
Новая
       19

React-Native Flatlist не воспроизводится из-за какой-то ошибки

0 голосов
/ 22 декабря 2018

Плоский список реализуется, но данные отображаются неправильно

App.js 

import React, {Component} from 'react';
import Main from './components/MainComponents';
import {Platform} from 'react-native';



const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
  android:
    'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});


export default class App extends Component<Props> {
  render() {
    return (
        <Main />

    );
  }
}

MainComponent.js 

import React,{Component} from 'react';
import {Menu} from './MenuComponent';
import { DISHES } from '../shared/dishes';


class Main extends Component{

    constructor(props){
        super(props);
        this.state={
            dishes: DISHES
        }
    }

    render(){
        return(
            <Menu dishes={this.state.dishes} />
        )
    }

}

export default Main

MenuComponent.js 

import React,{Component} from 'react';
import {View,Flatlist } from 'react-native';
import {ListItem} from 'react-native-elements';

function Menu(props){


    const renderMenuItem=({item,index}) => {
        return(
            <ListItem
                key={index}
                title={item.name}
                subtitle={item.description}
                hideChevron={true}
                leftAvatar={{ source: require('./images/images/buffet.png')}}
            />
        )
    }

    return(
        <Flatlist 
        data={props.dishes}
        renderItem={renderMenuItem}
        keyExtractor={item => item.id.toString()}
        />
    )
}

export default Menu

Ошибка

вы, скорее всего, забыли экспортировать свой компонент или еще васперепутал импорт по умолчанию и с именами

Я прочитал все связанные с этим вопросы, но doest'nt не помог мне Newbiew реагировать-нативный

Справка будет сильно оценена

Спасибо

1 Ответ

0 голосов
/ 22 декабря 2018

Поскольку компонент Меню является экспортом по умолчанию, вы не можете импортировать его, как {Меню}, поэтому

В вашем MainComponent.js

Изменить 

   import {Menu} from './MenuComponent';

На 

   import Menu from './MenuComponent';

Также

Изменить 

import Main from './components/MainComponents';

На 

import Main from './components/MainComponent';
...