更新记录

1.0.0（2023-08-02） 下载此版本

初次提交

平台兼容性

uni-app

其他

YR-ConfirmDialog

IOS风格确认对话框

预览

使用方式：

vue2

<template>
    <view class="content">
        <button @click="handleOpen">{{title}}</button>
        <YR-ConfirmDialog ref="yrmodel"></YR-ConfirmDialog>
    </view>
</template>

<script>
    export default {
        data() {
            return {
            }
        },
        methods: {
            handleOpen() {
                // 默认 点击确认按钮会执行then，取消执行catch
                this.$refs.yrmodel.open({
                    content: '用户名或密码错误！',
                    wanted: 1
                }).then(() => {
                }).catch(() => {

                })
                // 自定义按钮 只会执行then，返回参数为按钮下标及按钮
                this.$refs.yrmodel.open({
                    content: '密码错误！',
                    customButtons: [
                        {
                            text: '重新输入'
                        },
                        {
                            text: '通过邮箱找回密码'
                        },
                        {
                            text: '通过手机找回账号'
                        }
                    ],
                    wanted: 1
                }).then((idx, buttton) => {
                    console.log(idx, button)
                })
            }
        }
    }
</script>

使用方式是通过$refs去控制的，所有参数都是通过open函数传入，这样会方便连续调用并将与Dialog相关的变量分离。

vue3的使用方式类似。

参数

props

interface

open(params)
打开对话框，params参数如下:

动画来源取自animate.css，想使用其他动画可自行在项目里面添加修改

目前功能比较简单，有任何建议请在评论区提出讨论。