vue3 中 v-show 分页问题

[zhuoyue100]

const pagination = reactive({ page: 1, total: 9, page_size: 3 }) const showChart = computed(() => (i: number) => { let offset = (pagination.page-1)*pagination.page_size console.log(i, i > offset && i <= offset+pagination.page_size) return i > offset && i <= offset+pagination.page_size })

首次展示正确，点击分页按钮后不切换，这个怎么实现?

[doco]

showChart 如果是绑定到图表上控制显隐的话直接改成方法, 不要用 computed
```
function showChart(index: number) {
...
}
```

[zhuoyue100]

就是页面有 9 个元素，每次显示 3 个，用的 element plus 分页插件，分页时控制元素的显示隐藏，我上面写的没效果

[dingjs]

把计算属性去掉就行了，这个返回函数多此一举，猜测应该是 computed 返回的函数未立即执行，没能收集到依赖，在分页变化后不会更新对应的函数。

分页场景下更合理的是用 计算属性 + 数组 slice 直接返回应该展示的数据，而不是用 v-show 。

typescript```
// 第一种改法
const showChart = (i: number) => {
let offset = (pagination.page - 1) * pagination.page_size;

return i > offset && i <= offset + pagination.page_size;
};
```

[zhuoyue100]

@dingjs 按照你的方法可以了，感谢~