uniapp 自定义toast

要在uniapp中自定义toast，可以使用uni.showToast()方法，该方法接受一个对象作为参数，其中包含要显示的内容、图标等信息。可以通过在该对象中指定自定义的图标和样式来实现自定义toast。

以下是一个示例代码：

<template>
  <view class="container">
    <button @tap="showToast">显示toast</button>
  </view>
</template>

<script>
export default {
  methods: {
    showToast() {
      uni.showToast({
        title: '自定义toast',
        icon: 'none',
        duration: 2000,
        image: '/static/custom-toast.png',
        mask: true,
        success: (res) => {
          console.log('toast显示成功', res)
        },
        fail: (err) => {
          console.log('toast显示失败', err)
        },
        complete: () => {
          console.log('toast显示完成')
        }
      })
    }
  }
}
</script>

<style>
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
</style>

在以上代码中，我们在调用uni.showToast()方法时指定了一个对象作为参数，其中：

- title：要显示的内容
- icon：不显示图标
- duration：显示时间为2秒
- image：自定义的图标
- mask：遮罩层，防止用户误触
- success、fail、complete：toast显示成功、失败或完成时的回调函数

通过设置image属性为自定义图标的路径，我们实现了自定义toast的效果。需要注意的是，自定义图标的尺寸和样式需要根据实际情况进行调整，以达到最佳显示效果。