Cannot Read Properties of Undefined in ( reading Show Toast ) when using Native base to show Toast in React Native app

Question

When I try to use the Toast message in my React native app, While navigating from one page to another page I do know in which scenario this error comes but, The APP crashes suddenly without any error. When I try to debug it says "Cannot Read Properties of Undefined in ( Reading Show Toast ) "

// Importing the Toast 
import { Button, Grid, Col, Text, Toast, Root } from 'native-base'; 

// Declaring the Toast

const toastr = {
  showToast: (message, duration = 2500,) => {
    Toast.show({
      text: message,
      duration,
      position: 'bottom',
      textStyle: { textAlign: 'center', fontSize: moderatescale(12), fontWeight: 'bold' },
      style: { backgroundColor: 'black', borderRadius: moderatescale(40), marginRight: moderatescale(20), marginLeft: moderatescale(20), marginBottom: moderatescale(55) }
    });
  },
};

// Calling the Toast like this one !!!

let message = "No Workorders found for this Asset"
 toastr.showToast(message);

I need help regarding the above issue to solve or any other solution to prevent it !!!`

Answer 1

use useToast from native-base.

import { useToast } from 'native-base';

const toast = useToast();

toast.show({ title: "Hello world" })