user567
user567

Reputation: 3862

Use ref to invoke instance methods

I am using the react-native-drawer-menu to create a slider menu. I am not able to open the menu manually when a button is clicked. In the documentation they said that this could be done by using the ref to invoke instance the methods openDrawer.

this is my code

import Drawer from 'react-native-drawer-menu'

  myFunction(){
    Drawer.openDrawer();
  }

and I get this error

reactNativeDrawerMenu2.default.openDrawer is not a function. (In '_reactNativeDrawerMenu2.default.openDrawer()', '_reactNativeDrawerMenu2.default.openDrawer' is undefined) 2017-10-17 13:16:24.299 [fatal][tid:com.facebook.react.ExceptionsManagerQueue] Unhandled JS Exception: _reactNativeDrawerMenu2.default.openDrawer is not a function. (In '_reactNativeDrawerMenu2.default.openDrawer()', '_reactNativeDrawerMenu2.default.openDrawer' is undefined)

Upvotes: 1

Views: 537

Answers (2)

Daniel Andrei
Daniel Andrei

Reputation: 2684

As @lipp said, except this is the API of the module:

So it becomes:

<Drawer ref={(node) => {this.drawer = node;}} />

and then you can use their API like:

this.drawer.open()

Upvotes: 1

lipp
lipp

Reputation: 5936

You need to store the ref ("reference") to the drawer. I think it should be

import Drawer from 'react-native-drawer-menu'

class Foo extends React.Component {
  render () {
    return (
      <Drawer ref={drawer => this.drawer = drawer}>
        <View>
          <Button onPress={() => this.drawer.open()}
        </View>
      </Drawer>
  }
}

Upvotes: 3

Related Questions