vant-weapp dialog弹层before-close的用法

littlebearGreat

已于 2023-07-27 15:46:28 修改

阅读量880

点赞数 1

分类专栏：前端笔记文章标签：前端 vant-weapp before-close

于 2023-07-27 15:14:27 首次发布

本文链接：https://blog.csdn.net/littlebearGreat/article/details/131960775

版权

前端笔记专栏收录该内容

126 篇文章 2 订阅

订阅专栏

不得不说，真的坑呀。

vant-weapp dialog弹层before-close绑定方法不生效，绑定data中的方法才生效。正确的写法如下

<van-dialog 
    use-slot 
    title="弹层" 
    show="{{show}}" 
    before-close="{{beforeCloseFunction}}" 
>
</van-dialog>

Page({
    data: {
        show: false,
        beforeCloseFunction: null
    },

    onLoad() {
        this.setData({beforeCloseFunction: this.beforeClose()})
    },

    beforeClose() {
        // 这里一定要用箭头函数，否则访问不到this
        return (type) => {
            console.log(type)
            console.log(this.data)
            if (type === 'cancel') {
                // 点击取消
                return true
            }else {
                // 点击确定
            }
        }
    }
})