场景:(移动端)A模块内容在当前界面最后面展示时,若需要选择相应条件或切换页签时,IOS会一直显示在页面最底部,不会保留之前的位置?
问题出现在每次切换条件时会先清空数组,然后等接口请求回来后重新赋值,这样就会导致dom重新加载,界面内容重新刷新
解决这个问题其实可以利用空的内容占位,这样不管怎么查询,之前的位置都不会发生变化,那我是利用骨架屏处理的,根据界面结构然后写个最大的视图高度,等数据加载回来就隐藏
测试代码如下:
<template><div><van-skeleton title :row="20" :loading="loading" /><div v-for="(item, index) in testList" :key="index">{{ item.name }}</div></div>
</template>
<script>
export default {name: 'test',data() {return {testList: [],loading: true,};},methods: {//获取数据getData() {this.testList = [{ name: '你' }, { name: '我' }, { name: '他' }];this.loading = false;},},created() {//一般在项目中会先清空数据然后调用接口赋值this.testList = [];this.getData();},
};
</script>
