3.5.2 Toast

Toast封装用到了react-native-root-toast三方库,创建pmobileToast方法, 参数data和timeOut。目的了为了在每次使用时候避免多次导入react-native-root-toast 以及避免写多个Toast.show,增加代码的易读性。

import Toast from 'react-native-root-toast';
let toast;
export  function pmobileToast (data,timeOut){
    toast && Toast.hide(myToast);
    toast=null;
    toast = Toast.show(data.message?data.message:'', {
        duration: data.duration?data.duration:Toast.durations.SHORT,
        position: data.position?data.position:Toast.positions.BOTTOM,
        shadow: data.shadow?data.shadow:true,
        animation: data.animation?data.animation:true,
        hideOnPress: data.hideOnPress?data.hideOnPress:true,
        delay: data.delay?data.delay:0,
        onShow:data.onShow && data.onShow,
        onShown:data.onShown && data.onShown,
        onHide:data.onHide && data.onHide,
        onHidden:data.onHidden && data.onHidden,
    });
    timeOut && setTimeout(()=>{
        Toast.hide(toast);
    }, timeOut);
}

方法参数

  • data:Toast展示所需要数据
  • timeOut :手动隐藏toast超时时间(一般不会使用)

Toast 参数

参数 描述
duration 持续时间:
Toast.durations.SHORT (equals to 2000)
Toast.durations.LONG (equals to 3500)
position 提示位置:
Toast.positions.TOP
Toast.positions.BOTTOM
Toast.positions.CENTER
shadow toast是否出现阴影
animation toast显示/隐藏的时候是否需要使用动画过渡
hideOnPress 是否可以通过点击事件对toast进行隐藏
delay toast显示的延时时间
onShow toast出现动画开始时回调
onShown toast出现动画结束时回调
onHide toast隐藏动画开始时回调
onHidden toast隐藏动画结束时回调
该文件修订时间: 2021-01-14 15:02:10

results matching ""

    No results matching ""