uniapp踩坑记录之uni.showToast

506 阅读1分钟

uni.showToast是uni-app提供的一个用于显示提示框的API,它可以用来显示消息提示给用户。

最基本的用法如下:

uni.showToast({

    title: '操作成功',

    icon: 'success',

    duration: 2000

});

参数包括:

  • title:提示的内容。
  • icon:图标,可选值为successloadingnone
  • duration:提示的延迟时间,单位为毫秒。
  • mask:是否显示透明蒙层,防止触摸穿透,默认为false
  • image:自定义图标的路径,字符串,支持临时路径和网络路径。

工作中遇到问题有:

1、icon为none时,小程序端title内容仅支持两行显示,提示内容过多,建议换方式实现,具体需要和产品商议后决定,用uni.showModel会多一步用户交互。

2、icon为success和error时,title 文本在小程序平台最多显示 7 个汉字长度,App仅支持单行显示。

3、icon为fail时,不显示title文本。

2、使用自定义image时,image路径支持绝对路径,图片放在项目static文件夹下,不支持在线路径,不支持分包路径,不支持base64。

如:image: '/static/image.png',

注:app端暂不支持gif,支付宝小程序存在兼容问题。

3、小程序自定义导航时,uni.showToast位置会偏移,具体需要具体场景中调整或换方式实现。

4、duration为0时,提示框不会自动关闭,需要执行业务逻辑关闭。

5、层级问题,需重写原生样式,重置与之冲突的弹窗z-index层级。