How do I show a toast from loader error?

Previously I used

useEffect

useEffect

to make fetch data and if there was any error used catch to show a toast

 useEffect(() => {
const fetch = async () => {
    try {
     const blogs = await getDataFromApi();
       setBlogs(blogs);
     } catch (error) {
       showToast(error); 👈 shows toast
    }
 };
}, []);

 useEffect(() => {
const fetch = async () => {
    try {
     const blogs = await getDataFromApi();
       setBlogs(blogs);
     } catch (error) {
       showToast(error); 👈 shows toast
    }
 };
}, []);

But now I am able to console log the errro but I don't see any toast

  loader: async () => await getDataFromApi();

  onCatch(error, errorInfo) {
    console.log(`found error ${error}`);
    console.log(`found errorInfo ${errorInfo}`);

    showToast(error);
  },

  onError(error) {
    console.log(`found error ${error}`);
    showToast(error);
  },

  loader: async () => await getDataFromApi();

  onCatch(error, errorInfo) {
    console.log(`found error ${error}`);
    console.log(`found errorInfo ${errorInfo}`);

    showToast(error);
  },

  onError(error) {
    console.log(`found error ${error}`);
    showToast(error);
  },

TanStack•14mo ago•

18 replies

living-lavender

How do I show a toast from loader error?

Previously I used

useEffect

useEffect

to make fetch data and if there was any error used catch to show a toast

 useEffect(() => {
const fetch = async () => {
    try {
     const blogs = await getDataFromApi();
       setBlogs(blogs);
     } catch (error) {
       showToast(error); 👈 shows toast
    }
 };
}, []);

 useEffect(() => {
const fetch = async () => {
    try {
     const blogs = await getDataFromApi();
       setBlogs(blogs);
     } catch (error) {
       showToast(error); 👈 shows toast
    }
 };
}, []);

But now I am able to console log the errro but I don't see any toast

  loader: async () => await getDataFromApi();

  onCatch(error, errorInfo) {
    console.log(`found error ${error}`);
    console.log(`found errorInfo ${errorInfo}`);

    showToast(error);
  },

  onError(error) {
    console.log(`found error ${error}`);
    showToast(error);
  },

  loader: async () => await getDataFromApi();

  onCatch(error, errorInfo) {
    console.log(`found error ${error}`);
    console.log(`found errorInfo ${errorInfo}`);

    showToast(error);
  },

  onError(error) {
    console.log(`found error ${error}`);
    showToast(error);
  },

How do I show a toast from loader error?

Similar Threads

How do I show a toast from loader error?

Similar Threads

Similar Threads

Similar Threads