You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
113 lines
2.3 KiB
113 lines
2.3 KiB
<template>
|
|
<view class="u-page">
|
|
<u-gap
|
|
height="30"
|
|
bgColor="#fff"
|
|
></u-gap>
|
|
<u-toast ref="uToast"></u-toast>
|
|
<u-cell-group title-bg-color="rgb(243, 244, 246)">
|
|
<u-cell
|
|
:titleStyle="{fontWeight: 500}"
|
|
:title="item.title"
|
|
v-for="(item, index) in list"
|
|
:key="index"
|
|
isLink
|
|
:icon="item.iconUrl"
|
|
@click="showToast(item)"
|
|
>
|
|
<!-- <image
|
|
slot="icon"
|
|
class="u-cell-icon"
|
|
:src="getIcon(item.icon)"
|
|
mode="widthFix"
|
|
></image> -->
|
|
</u-cell>
|
|
</u-cell-group>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
show: false,
|
|
list: [{
|
|
type: 'default',
|
|
title: '默认主题',
|
|
message: "锦瑟无端五十弦",
|
|
iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
|
|
},
|
|
{
|
|
type: 'error',
|
|
icon: false,
|
|
title: '失败主题',
|
|
message: "一弦一柱思华年",
|
|
iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
|
|
},
|
|
{
|
|
type: 'success',
|
|
title: '成功主题(带图标)',
|
|
message: "庄生晓梦迷蝴蝶",
|
|
iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
|
|
},
|
|
{
|
|
type: 'warning',
|
|
position: "top",
|
|
title: '位置偏移上方',
|
|
message: "望帝春心托杜鹃",
|
|
iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/top.png'
|
|
},
|
|
{
|
|
type: 'loading',
|
|
title: '正在加载',
|
|
message: "正在加载",
|
|
iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/loading.png'
|
|
},
|
|
{
|
|
type: 'default',
|
|
title: '结束后跳转标签页',
|
|
message: "此情可待成追忆",
|
|
url: '/pages/componentsB/tag/tag',
|
|
iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/jump.png'
|
|
}
|
|
],
|
|
}
|
|
},
|
|
computed: {
|
|
getIcon() {
|
|
return path => {
|
|
return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
showToast(params) {
|
|
this.$refs.uToast.show({
|
|
...params,
|
|
complete() {
|
|
params.url && uni.navigateTo({
|
|
url: params.url
|
|
})
|
|
}
|
|
})
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.u-page {
|
|
padding: 0;
|
|
}
|
|
|
|
.u-cell-icon {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
|
|
.u-cell-group__title__text {
|
|
font-weight: bold;
|
|
}
|
|
</style>
|
|
|