CODEWITHSUNDEEP
react-native-popup-menu
Guy
Guy

Reputation: 121

Add Children through array.forEach() to <MenuOptions>

I tried everything I can think of and I can't seem to have it working

I want to add multiple options from an array like this

<Menu renderer={renderers.SlideInMenu} ref={(ref) => statusRef = ref}>
    <MenuTrigger/>
        <TouchableWithoutFeedback onPress={this.onQuestionStatusButtonPressed}>
            <View style={styles.view_header_submit_icon}>
                <Icon style={styles.icon_header_submit} name={"dots-vertical"} />
            </View>
        </TouchableWithoutFeedback>
        <MenuOptions>
            {this.state.subjects.forEach((value) => {
                <MenuOption >
                    <View style={styles.view_option}>
                        <Text style={styles.text_option}>value.name</Text>
                    </View>
                </MenuOption>
            )}
        </MenuOption>
    </MenuOptions>
</Menu>

This doesn't work for me Am I doing something wrong? and the array has items in it because I debugged it with the console and it runs 2 times but never renders

Upvotes: 0

Views: 145

Answers (1)

sodik
sodik

Reputation: 4683

Your code does not seem to be syntactically correct (e.g. extra </MenuOption>) and you have empty trigger but outside extra touchable..

Secondly - forEach won't work as it has no return value - use map instead.

I made simple working demo https://snack.expo.io/SJBJkr7yQ and it works without any problems

<Menu> <MenuTrigger text="Select action" /> <MenuOptions> <MenuOption onSelect={() => alert(`Save`)} text="Save" /> {this.state.subjects.map(s => <MenuOption key={s} text={s}/>)} </MenuOptions> </Menu>

Pro-tip: start with the simplest working example (eg. from official documentation) and add step-by-step things always checking that everything works.

Upvotes: 0

Related Questions