Vue中删除数组分页中某一项时出现了小bug的吗(已解决)?

首先数组tableData我因为做分页,所以每一页都是截取总的数组的(listData


每一页都是六条,所以在删除的时候就不能用index。
我就用的是id-1,
刚刷新开始几条还有作用,但是一翻页就没用了,我看了控制台,删除没起作用。

 galleryMaskPop(index){
          this.$confirm("您正在进行删除操作,您确定要删除吗?", '删除', {
              cancelButtonText: '取消',
              confirmButtonText: '确定',
              showClose:false,
              cancelButtonClass:'openPop_can',
              confirmButtonClass:'openPop_con'
            }).then(() => {
         这里是删除
              let id=this.listData[index].id-1;
              console.log(id)
               this.tableData.splice(id, 1);
               console.log(this.tableData)
               this.getList();

              this.$message({
                type: 'success',
                message: '删除成功!'
              });
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消删除'
              });
            });
        },

getList方法是获取总的数组tableData,对它进行分页。

getList() {
        var filterData=this.tableData;
          this.listData = filterData.filter((item, index) =>
              index < this.pageConfigTotal.page * this.pageConfigTotal.limit && index >= this.pageConfigTotal.limit * (this.pageConfigTotal.page - 1)
          )
          this.pageConfigTotal.total = filterData.length;
      },

HTML循环我用的是

<li v-for=" (item,index) in listData" :key="item.id"></li>

我发现问题了,是我用的id错误了,要考虑删除后数据总量是会变的。所以还是得要用index。我再想想吧。
自己解决了,是我index值没有算对。