<template>
<div>
<van-overlay :show="showOverlay" @click="toggleOverlay" />
<van-button @click="toggleOverlay">显示遮罩层</van-button>
</div>
</template>
<script>
export default {
data() {
return {
showOverlay: false
};
},
methods: {
toggleOverlay() {
this.showOverlay = !this.showOverlay;
}
}
};
</script>
在上面的例子中，van-overlay 组件通过 :show 属性控制是否显示遮罩层。点击按钮时，通过 @click 事件触发 toggleOverlay 方法，从而切换 showOverlay 的状态，控制遮罩层的显示与隐藏。
请确保你已经正确引入了 Vant 组件库，并按照其文档进行了配置。
转载请注明出处：http://www.zyzy.cn/article/detail/5673/Vant