javascript - onPress 在 iOS 设备的菜单中不起作用

Question

我想提一下，这个问题只发生在 ios 设备上，android 工作正常。

我有菜单 userMenu 类

 import Menu, {MenuItem, MenuDivider} from 'react-native-material-menu';

 class UserMenu extends React.Component {      

        logout() {
            this.props.logout().then(() => {
                this.props.navigation.navigate('Auth')
            })
        }        

        render() {

            return (
                <React.Fragment>
                    <Menu
                        ref={ref => this._menu = ref}
                        button={
                            <Text
                                style={{padding: 15}}
                                onPress={() => {
                                    this._menu.show()
                                }}>
                                <FontAwesome5 name={'caret-down'} color={'#fff'} size={25}/>
                            </Text>
                        }
                    >
                        <MenuItem disabled={true}>{this.props.auth.user.customer.name}</MenuItem>
                        <MenuDivider/>
                        <MenuItem
                            onPress={() => {
                                this._customerProfile.show();
                                this._menu.hide();
                            }}>
                            <FontAwesome5 name={'cog'}/> Settings
                        </MenuItem>
                        <MenuItem
                            onPress={this.logout.bind(this)}>
                            <FontAwesome5 name={'sign-out-alt'}/> Logout
                        </MenuItem>
                    </Menu>

                    <CustomerProfile
                        onRef={ref => this._customerProfile = ref}
                    />
                </React.Fragment>
            )
        }

    };

如果我单击菜单中的设置，它会调用 this._customerProfile.show() 也 this._menu.hide() 菜单隐藏有效，但 customerProfile 未显示。如果我将菜单项放在菜单之外，它可以显示 customerProfile。

知道什么可能导致此问题吗？

Answer 1

您应该使用 TouchableOpacity

renderButton: function() {
  return (
    <TouchableOpacity onPress={this._onPressButton}>
      <Image
        style={styles.button}
        source={require('./myButton.png')}
      />
    </TouchableOpacity>
  );
},

链接ref