vant组件中,在页面弹出层内点击按钮弹出日历组件时报错
<template>
<div>
<button @click="isShow = true">点我弹弹出层</button>
<van-popup
v-model="isShow"
class="popup"
position="right"
@click-overlay="onClose"
>
<button @click="isShowC = true">点我弹日历</button>
<van-calendar
v-model="isShowC"
/>
</van-popup>
</div>
</template>
<script>
export default {
name: "",
data() {
return{
isShow: false,
isShowC: false
}
},
created() {},
mounted() {},
methods:{}
};
</script>
代码如上,有人遇到过同样问题么,求解答~~
解决方案一:
van-calendar组件中添加 v-if 条件渲染属性,v-if="isShowC"
缺点:日历选择器将没有出现/隐藏过渡动画
解决方案二:
把 van-calendar组件 挪到 van-popup 外层去,例如与 van-calendar组件 同层
推荐解决方案二,github上类似问题issue:https://github.com/youzan/vant/issues/10360