0

I use react-native-toast-notification from https://github.com/arnnis/react-native-toast-notifications#readme

I want customized toast, if successful to show a green toast, while on failure a red toast like on photo. enter image description here

My code in App:

import { ToastProvider } from 'react-native-toast-notifications'
<ToastProvider
  placement="bottom"
  duration={5000}
  animationType='slide-in'
  animationDuration={250}
  textStyle={{ fontSize: 20 }}
  offset={50}
  successColor="green"
  normalColor="red"
  offsetTop={30}
  offsetBottom={40}
  swipeEnabled={true}
  renderType={{
    custom_type: (toast) => (
      <View style={{ padding: 15 }}>
        <Text>{toast.message}</Text>
      </View>
    )
  }}>

And my code in screen:

import { useToast } from "react-native-toast-notifications";

 const onSubmit = (data: IEventPasscode) => {
dispatch(
  eventEnterPasscode({
    body: data,
    onSuccess: () => { 
    toast.show("Hello World"), {
        type: "success",
      },
    onFailure: () => {
      return;
    },
  }),
);

};

And here is the results. enter image description here

Manche
  • 47
  • 2
  • 10

1 Answers1

2

i found a mistake in your code ,you should pass type:success this way:

toast.show("Hello World",{type:"success"})
lawrence
  • 66
  • 3