What I'm trying to do is use data from another component in my if-else statement.
This is my class screen:
class Restaurant {
constructor(
id,
Categoryids,
name,
time,
km,
ImageUrl,
recommended,
fav,
) {
this.id = id;
this.Categoryids = Categoryids;
this.recommended = recommended;
//more this....
}
}
export default Restaurant;
I have a dummy data component that has all the data for each section. For the recommended, I wrote the data as 'true' or 'false'. And if I understand correctly, this would make them a boolean.
For my homepage which is where I want to output the component, I did:
import React from 'react';
import { StyleSheet, Text, View, Button, Image, ScrollView, FlatList,
TouchableOpacity, Platform } from 'react-native';
import { FAVORITE, RESTAURANT } from '../extra/dummy-data';
import Homedesign from '../Components/Homedesign';
import HeaderButton from '../Components/HeaderButton';
import { HeaderButtons, Item } from 'react-navigation-header-buttons';
import MealItem from '../Components/MealItem'
const Homepage = props => {
const renderMealItem = itemData => {
if (RESTAURANT.recommended === 'true') {
return (
<MealItem
name={itemData.item.name}
image={itemData.item.imageUrl}
time={itemData.item.time}
km={itemData.item.km}
onSelectMeal={() => {
props.navigation.navigate({
routeName: 'MealDetail',
params: {
RestaurantId: itemData.item.id
}
});
}}
/>
);
}
}
const favId = props.navigation.getParam('favoriteId');
const displayedRestaurant = RESTAURANT.filter(
Restaurant => Restaurant.Categoryids.indexOf(favId) >= 0
)
return (
<View style={styles.screen}>
<FlatList
data={displayedRestaurant}
renderItem={renderMealItem}
style=
/>
</View>
);
};
I assumed that for this to work we would use an if-else statement.
Aucun commentaire:
Enregistrer un commentaire