react-native-mix-toast 轻提示
DESCRIBE
Android和iOS平台通用的自定义Toast UI组件
USAGE
INSTALL
npm install react-native-mix-toast
IMPORT
;
EXAMPLE
Toast;
FUNC
show(content,{options})
显示Toast
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
content | Toast显示文本内容,可为React.Node |
string 、node |
- |
{options} | Toast显示参数API | object |
- |
update(toast,content,{options})
更新Toast
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
toast | 需要更新的toast | object |
- |
content | 同show() |
string 、node |
- |
{options} | 同show() |
object |
- |
hide(toast)
可以主动调用关闭Toast
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
toast | 需要更新的toast | object |
- |
EXAMPLE
// show()var myToast = Toast;// update()Toast;// hide()Toast
API
属性 | 说明 | 类型 |
---|---|---|
content | Toast显示文本内容,也可传入React.Node |
string 、node |
options | Toast显示设置 | object |
OPTIONS
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
duration | 显示时间,默认提供LONG ,SHORT ,PERSIST |
number |
SHORT |
position | 显示位置,默认提供BOTTOM ,TOP ,CENTER |
number |
BOTTOM |
mask | 遮罩层 | bool |
false |
icon | 显示图标 | number 、node |
- |
opacity | 显示透明度 | number |
0.8 |
delay | 延时显示 | number |
0 |
animation | 渐入渐出动画,默认提供fade ,slide-right ,slide-left ,slide-bottom ,slide-top ,scale ,scale-vertical ,scale-horizontal |
string |
fade |
custom | 完全自定义显示内容 | boolean |
false |
keyboardAvoiding | 避免键盘遮挡 | boolean |
true |
toastStyle | Toast自定义样式 | object |
- |
textStyle | Toast文本自定义样式 | object |
- |
iconStyle | Toast图标自定义样式 | object |
- |
touchable | 可点击内容 | object |
- |
hideOnPress | 点击取消显示 | boolean |
fasle |
onPress | 点击Toast触发事件 | function |
- |
onShow | 显示动画开始调用函数 | function |
- |
onShown | 显示动画结束调用函数 | function |
- |
onHide | 消失动画开始调用函数 | function |
- |
onHidden | 消失动画结束调用函数 | function |
- |
DEMO
cd demonpm installnpm start
or