react-native-message-bar: Cannot read property 'hideMessageBarAlert' of undefined

Whenever I trigger an alert nothing seems to happen and I get this:

Possible Unhandled Promise Rejection (id: 0): Cannot read property 'hideMessageBarAlert' of undefined TypeError: Cannot read property 'hideMessageBarAlert' of undefined at Object.module.exports.hideAlert (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:16093:29) at Object.module.exports.showAlert (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:16071:6) at _callee2$ (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:80269:512) at tryCatch (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:5108:30) at GeneratorFunctionPrototype.invoke [as _invoke] (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:5384:12) at GeneratorFunctionPrototype.prototype.(anonymous function) [as next] (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:5141:13) at tryCatch (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:5108:30) at invoke (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:5184:12) at http://localhost:8081/index.ios.bundle?platform=ios&dev=true:5229:1 at tryCallTwo (http://localhost:8081/index.ios.bundle?platform=ios&dev=true:2626:1)

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 3
Comments: 19 (3 by maintainers)

Commits related to this issue

Merge pull request #7 from Talor-A/success-bar-fix remove red border from success bar — committed to denniszxxc/react-native-message-bar by Talor-A 7 years ago

Most upvoted comments

just ran in to a similar situation but had a loader before rendering which messed things up as well

error

    if(!this.state.loaded) return this.renderLoader();
    return <View style={{flex:1}}>
        {this.renderApp()}
        <MessageBarAlert ref="alert" />
    </View>

works

<View style={{flex:1}}>
        {(this.state.loaded) ? this.renderApp():this.renderLoader()}
        <MessageBarAlert ref="alert" />
</View>

johanmic on May 17, 2016

@temitope I switched to a different message bar package

isAlmogK on Jul 31, 2017

I’m having the same issue, does anyone have a good example

isAlmogK on Jul 25, 2017

@AlmogRnD can you share your code to show where you are getting an error?

temitope on Jul 31, 2017

@bfarrgaynor nvmnd got it working. i was not correctly rendering to keep the refs. works great now.

temitope on Mar 1, 2017

I’m having this problem with react-native Navigator. I’m not sure how to resolve.

ghost on Feb 5, 2017

Version: react-native-message-bar@1.4.1

var MessageBarAlert = require('react-native-message-bar').MessageBar; var MessageBarManager = require('react-native-message-bar').MessageBarManager; … ` componentDidMount: function() {

   MessageBarManager.registerMessageBar(this.refs.alert);
        MessageBarManager.showAlert({
          title: 'Success',
          message: 'Job has been marked as produced',
          alertType: 'success',
          // See Properties section for full customization 
          // Or check `index.ios.js` or `index.android.js` for a complete example 
        });

componentWillUnmount: function() {

  // Remove the alert located on this master page from the manager 
  MessageBarManager.unregisterMessageBar();

render: function() { return ( <View style={gStyles.mainContainer}>

            {toReturn}
            <FooterBar style={gStyles.footerBar} coreRoute={this.state.coreRoute} root={this}></FooterBar>
            <MessageBarAlert ref="alert" />
        </View>

   );

} `

I can successfully get the contents of MessageBarManager and MessageBarAlert when I put them through a console.log in my render function - so I know they are accessible and in scope.

bfarrgaynor on Apr 20, 2016