Stack Overflow
Stack Overflow

Questions tagged [react-toastify]

React-Toastify allows you to add notifications to your app with ease.

Some features of the library:

  • Easy to setup and customise
  • RTL support
  • Swipe to close
  • Can display a react component inside the toast
  • Has onOpen and onClose hooks. Both can access the props passed to the react component rendered inside the toast
  • Define behaviour per toast
  • Pause toast when window loses focus
  • You can control the progress bar ! :)

Check out the Github page for the project for more information and the documentation.

108 questions
0
votes
1 answer

react-toastify toasts from array objects

how can I display toasts by traversing an array of objects, each of these objects with a unique id and names. I need to display a toast for each object inside this array, with a text and the value…
CodeAgainst
  • 143
  • 3
  • 12
0
votes
0 answers

react useReducer() best practice

I'm currently working on a notification component using toast-react and useReducer hook. I'm thinking to trigger the notification in the reducer method. Will there an issue/side effects with this approach? First time to use react's userReducer()…
Wreeecks
  • 2,186
  • 1
  • 33
  • 53
0
votes
0 answers

React toastify via key press

can we use key press (Enter /spacebar) to close react toastify popup? currently I am closing the popup via button click and default time.
Devika B Raj
  • 31
  • 2
0
votes
0 answers

creating custom error when no entries has been made using toast for React

I am in the middle of creating error handlings using toast function for my react app signin and register pages, I was able to successfully create a toast function that when logging in with wrong email or password they should receive an error…
Motty
  • 3
  • 2
0
votes
0 answers

React toastify not properly running when spinning up storybook?

This is the error that keeps showing up when I run yarn storybook. My react-toastify is on v9.0.8. Can't import the named export 'cloneElement' from non EcmaScript module (only default export is available)
nikkideeznutzz
  • 1
  • 1
0
votes
0 answers

How To Make Toast Throw Out Custom Errors

I am using MongoDB and I installed react toastify to show errors from my backend for sign in but I can not seem to show them. How do I fix this issue? because I can output toast messages but not the custom errors I have. js file where my toast…
Bqdor
  • 19
  • 5
0
votes
2 answers

How can I change the styles of the react-toastify popup message with Styled-Components?

I would like to see your decision... because I have something like it .Toastify__toast--success { border: 1px solid black } in my globalStyles
Radomir Radionov
  • 21
  • 6
0
votes
1 answer

Need to make React Toast in Catch Block Axios

Hi Every one I want to make a React-Toast notification for making catch but it not working currently my function is something like this const naviagte = useNavigate(); const dispatch = useDispatch(); const [inputs, setInputs] = useState({ …
user13856242
0
votes
1 answer

React toastify popup not showing

I want to show a success message popup using react toastify after closing a modal but it is not working. Maybe because i am using animation to give a slight delay when closing modal. Can i do something like use timeout and then run…
H.b
  • 239
  • 2
  • 13
0
votes
1 answer

How to pass data in promise to toastify in react?

I am trying to pass the data.message that I am getting in the fetch call to the success of toastify promise. I know I can do a toast.success in there but I specifically want to use toastify promise and want to see how I can pass data in promise. …
Sugar Code
  • 25
  • 5
0
votes
0 answers

React js using Toastify does not display if there is more than 1 condition, but Alert will work fine

I am trying to add points to the result if a question is answered correctly and take away 10 points if the user answers the wrong question. I am also wanting to display a toast message that let's the user know if their selection was right or wrong.…
Rina Mendoza
  • 1
  • 1
0
votes
1 answer

react-toastify shows before i click

I've madenotify function which takes parameter const notify = (error) => { toast.error(error) } and dom as where error is my useState hook , which is set if something is fetched from redux rtk.…
Rajanboy
  • 2,266
  • 2
  • 8
  • 15
0
votes
2 answers

How to give a toast message, when user add an item?

import React from 'react'; import { useForm } from "react-hook-form"; import { toast } from 'react-toastify'; const AddStorage = () => { const { register, handleSubmit } = useForm(); const onSubmit = data => { console.log(data); …
Nurul Islam
  • 1
  • 1
  • 2
0
votes
1 answer

react-toastify popup showing 2 times

Website error visual on chrome I create a react website. On this website, I create a social login icon using firebase-hooks. But when I click on the social login button the pop-up shows. But after closing that pop-up I use react toastify to show the…
arfat rahman
  • 1
  • 3
0
votes
2 answers

Trying to add style on react toastify

I am trying to add custom style on react toastify, firstly I have import these import { ToastContainer, toast } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.css'; than call the react toast: const handleToast = () => { …
Provashish Roy
  • 16
  • 1
  • 3
1 2 3 4
5
6 7 8