uniapp showtoast 样式修改

你可以通过修改全局样式或者在单个页面中的样式来修改 `uni.showToast` 的样式。

1. 全局样式

在 `App.vue` 中的 `style` 标签中添加以下样式：

/* uni.showToast 样式修改 */
.uni-toast__text {
  color: #fff; /* 文本颜色 */
  background-color: rgba(0, 0, 0, 0.7); /* 背景颜色 */
  border-radius: 4px; /* 圆角 */
  padding: 10px 16px; /* 内边距 */
}

2. 单个页面样式

在需要修改样式的页面中的 `style` 标签中添加以下样式：

/* uni.showToast 样式修改 */
.custom-toast__text {
  color: #fff; /* 文本颜色 */
  background-color: rgba(0, 0, 0, 0.7); /* 背景颜色 */
  border-radius: 4px; /* 圆角 */
  padding: 10px 16px; /* 内边距 */
}

然后在触发 `uni.showToast` 的地方，添加 `icon` 和 `mask` 参数，并在 `success` 回调函数中添加以下代码：

uni.showToast({
  title: '这是一条提示信息',
  icon: 'none',
  mask: true,
  success() {
    const toast = document.querySelector('.uni-toast__text');
    if (toast) {
      toast.classList.add('custom-toast__text');
    }
  }
})

这样就可以通过添加自定义样式类来修改 `uni.showToast` 的样式了。