vue3+vant遇到的问题 安装vue3

安装vue3

声明

在这里用的是按需引入

Dialog的使用

Dialog 弹出框

效果图

import { Dialog } from "vant";
//弹窗
const state = reactive({
  show: false,
});
function confirm() {//打开弹窗
  state.show = true;
}
const confirmFn=()=>{//点击确定按钮的回调
  console.log('确定');
  state.show = false;
}
const cancelFn=()=>{//点击取消按钮的回调
  state.show = false;
}
<template>
    <div class="settingBtn">
      <Button round block type="primary" color="#1ba9ba" @click="confirm">
        退出登录
      </Button>
      <Dialog
        v-model:show="state.show"
        title="你确定要退出吗"
        show-cancel-button
        @confirm=confirmFn
        @cancel=cancelFn
      >
      </Dialog>
    </div>
</template>