2025年01月17日 建站教程
vue如何做一个抽屉效果，实现点击鼠标关闭抽屉？下面web建站小编给大家简单介绍一下具体实现代码！
示列代码如下：
<template>
<div>
<!-- 抽屉内容 -->
<div class="drawer-box" v-show="visible">
<!-- 抽屉组件内容 -->
</div>
<!-- 遮罩层 -->
<div class="drawer-mask" v-show="visible" @click="close"></div>
</div>
</template>
<script>
export default {
data() {
return {
visible: true //默认开启抽屉
};
},
methods: {
close() {
this.visible = false; // 关闭抽屉
}
}
};
</script>
本文链接：http://so.lmcjl.com/news/21524/