toast ​

<template>
  <jp-page class="rstoast">
    <view class="ml-2 mt-2">状态</view>
    <jp-section-selector :current="-1" vibrate-short :list="['success', 'error', 'warning', 'default']" @change="change1"></jp-section-selector>
  </jp-page>
</template>

<script lang="ts" setup>
import { reactive } from 'vue'

const { showToast } = useStore('globalUI')

const attribute = reactive({
  changeIndex: 0
})

onMounted(() => {
  setTimeout(function () {
    change1(0)
  }, 1000)
})
const change1 = (index) => {
  attribute.changeIndex = index
  if (index === 0) {
    showToast({
      message:
        '这里是内容这里是内里容这里这里是内里容这里是内容这是这里是内里容这里是内容这是这里是内里容这里是内容这是这里是内里容这里是内容这是这里是内里容这里是内容这是是内容这是内容',
      type: 'success'
    })
  }
  if (index === 1) {
    showToast({ message: '这里是内容这里', type: 'error' })
  }
  if (index === 2) {
    showToast({ message: '这里是内容这里是内容这里是内容这里是内容', duration: 5000, type: 'warning' })
  }
  if (index === 3) {
    showToast({ message: '这里是内容这里是内容这里是内容这里是内容' })
  }
}
</script>

<style scoped lang="scss"></style>