I use react-native-toast-notification from https://github.com/arnnis/react-native-toast-notifications#readme
我想要自定义的吐司,如果成功显示绿色吐司,而在失败的红色吐司像照片。
我在应用程序中的代码:
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>
)
}}>
屏幕上显示我的代码:
import { useToast } from "react-native-toast-notifications";
const onSubmit = (data: IEventPasscode) => {
dispatch(
eventEnterPasscode({
body: data,
onSuccess: () => {
toast.show("Hello World"), {
type: "success",
},
onFailure: () => {
return;
},
}),
);
};
这是结果。
1条答案
按热度按时间bvuwiixz1#
当你使用custom_type时,你应该自己设置背景颜色,例如:
您可以使用data属性传递bg_color:
toast.show("Show custom toast", {data: { bg_color: 'green' }})