React Native Navigation - [FAB]floating action button does not display as expected

Question

I am working with a React-native-navigation(wix) and there is a problem associated with React native FAB (Floating action button).

Requirement - I need to set FAB inside the componentDidMount lifecycle method as follows

componentDidMount() {
  this.props.navigator.setButtons({
    fab: {
     collapsedId: "someFormName",
     ...getAddButtonStyle()
    }
  });
}

I manage this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this)); globally and it work as expected. The problem here I have is the FAB is not showing as expected in my UI when I set it inside the componentDidMount() but if I set as a static button it works perfectly. Also it does the job perfectly inside render() function.

I am confused why can't I set the button inside componentDidMount() [initial page load] ?