vant框架里面vue2版本的里面有一个组件popup弹出层 这个popup好像自带了一个keep-alive一样 他会记录上一次关闭的时候他的组件的滚动条高度 然后下一次打开的时候不是页面最顶部,重新给里面的内容赋值都不行,不知道怎么解决了
您好,根据您所述,似乎是因为popup组件默认会缓存滚动条的位置,导致在下次打开时滚动条位置不在页面顶部。
如果您希望每次打开popup组件时都将滚动条置于页面顶部,可以通过在打开popup组件时设置resetScroll选项来实现。在打开popup组件时,将resetScroll选项设置为true即可:
<template>
<div>
<van-button type="primary" @click="showPopup = true">打开popup</van-button>
<van-popup v-model="showPopup" :reset-scroll="true">
<div>popup内容</div>
</van-popup>
</div>
</template>
<script>
export default {
data() {
return {
showPopup: false
}
}
}
</script>
这样,每次打开popup组件时,弹出层中的滚动条都会被重置到页面顶部。
如果您希望禁用popup组件的缓存滚动条位置功能,可以将lazyRender选项设置为false。但是需要注意,禁用这个功能可能会影响性能,因为每次打开popup组件时都会重新渲染弹出层中的内容。
<template>
<div>
<van-button type="primary" @click="showPopup = true">打开popup</van-button>
<van-popup v-model="showPopup" :lazy-render="false">
<div>popup内容</div>
</van-popup>
</div>
</template>
<script>
export default {
data() {
return {
showPopup: false
}
}
}
</script>
希望这些信息能够对您有所帮助。
lazy-render 设置false 试试