97 lines
2.6 KiB
Python
97 lines
2.6 KiB
Python
<template>
|
||
<view class="u-demo">
|
||
<view class="u-demo-wrap">
|
||
<view class="u-demo-title">演示效果</view>
|
||
<view class="u-demo-area">
|
||
<u-toast ref="uToast"></u-toast>
|
||
<view class="u-no-demo-here" style="text-align: left;">
|
||
这里仅对部分验证规则进行演示，目前总的验证规则有如下：
|
||
</view>
|
||
<u-table style="margin-top: 20rpx;">
|
||
<u-tr>
|
||
<u-td>邮箱号</u-td>
|
||
<u-td>手机号</u-td>
|
||
<u-td>URL</u-td>
|
||
<u-td>普通日期</u-td>
|
||
</u-tr>
|
||
<u-tr>
|
||
<u-td>十进制数</u-td>
|
||
<u-td>身份证号</u-td>
|
||
<u-td>车牌号</u-td>
|
||
<u-td>金额</u-td>
|
||
</u-tr>
|
||
<u-tr>
|
||
<u-td>汉字</u-td>
|
||
<u-td>字母</u-td>
|
||
<u-td>字母|数字</u-td>
|
||
<u-td>包含值</u-td>
|
||
</u-tr>
|
||
<u-tr>
|
||
<u-td>数值范围</u-td>
|
||
<u-td>长度范围</u-td>
|
||
<u-td width="50%"></u-td>
|
||
</u-tr>
|
||
</u-table>
|
||
</view>
|
||
</view>
|
||
<view class="u-config-wrap">
|
||
<view class="u-config-title u-border-bottom">
|
||
参数配置
|
||
</view>
|
||
<view class="u-config-item">
|
||
<view class="u-item-title">邮箱</view>
|
||
<u-subsection vibrateShort :list="email" @change="emailChange"></u-subsection>
|
||
</view>
|
||
<view class="u-config-item">
|
||
<view class="u-item-title">手机号</view>
|
||
<u-subsection vibrateShort :list="mobile" @change="mobileChange"></u-subsection>
|
||
</view>
|
||
<view class="u-config-item">
|
||
<view class="u-item-title">中文</view>
|
||
<u-subsection vibrateShort :list="chinese" @change="chineseChange"></u-subsection>
|
||
</view>
|
||
<view class="u-config-item">
|
||
<view class="u-item-title">整数</view>
|
||
<u-subsection vibrateShort :list="digits" @change="digitsChange"></u-subsection>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
email: ['google@gmail.com', 'google艾特gmail.com'],
|
||
mobile: ['13478561273', '0778-3423082'],
|
||
chinese: ['天青色等烟雨', 'Beat it'],
|
||
digits: [283, '下雨的声音']
|
||
}
|
||
},
|
||
methods: {
|
||
toast(type) {
|
||
this.$refs.uToast.show({
|
||
type: type ? 'success' : 'error',
|
||
title: type ? '验证通过' : '验证失败'
|
||
})
|
||
},
|
||
emailChange(index) {
|
||
this.toast(this.$u.test.email(this.email[index]));
|
||
},
|
||
mobileChange(index) {
|
||
this.toast(this.$u.test.mobile(this.mobile[index]));
|
||
},
|
||
chineseChange(index) {
|
||
this.toast(this.$u.test.chinese(this.chinese[index]));
|
||
},
|
||
digitsChange(index) {
|
||
this.toast(this.$u.test.digits(this.digits[index]));
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.u-demo {}
|
||
</style>
|