Django DRF+；VueJS分页错误的页数

我正在尝试使用

DRF

分页后端和

VueJs前端

。我试图创建分页链接，但直到现在我只得到第一个数字。我已将

PageNumberPagination

添加到我的

settings.py

。在文章

viewset

之后：

class ArticleViewSet(viewsets.ModelViewSet):
    queryset = Article.objects.all()
    lookup_field = "slug"
    serializer_class = ArticleSerializer
    permission_classes = [IsAuthenticated, IsAuthorOrReadOnly]
    pagination_class = PageNumberPagination

我使用了

Bootstrap Vue

如果我在浏览器中检查api地址，我可以看到下一个和上一个数据

{
    "count": 4,
    "next": "http://localhost:8000/api/articles/?page=2",
    "previous": null,
    "results": [...]
}

---

如何更改总行的数据以使分页工作？感谢

简单地说，我添加了我的下一篇文章，我回答了关于请求的问题，我现在使用vuex，但VueJs也类似：

fetchArticles (context) {
    context.commit("fetchStart");
    let endpoint = "articles/"

    if (context.state.next) {
      endpoint = context.state.next;
    }

    return ApiService.get(endpoint)
        .then(data=>{
          console.log(data);

          context.commit("setArticles", data.data.results)
          if (data.data.next) {
            context.commit("setNext", data.data.next);
          } else {
            context.commit("setNext", null)
          }
        })
        .catch((response) => {
        console.log(response);
        context.commit("setError", response.data.errors)
      })
  },

从我的vuetemplate中，我将其称为，例如：

<script>
import { mapGetters, mapActions} from "vuex";
export default {
    name: "Articles",
    computed: {
  },
  methods: {
    ...mapActions(['articles/fetchArticles']),
    getArticles() {
        return this.$store.dispatch('articles/fetchArticles');
    },
  },
  created() {
    this.$store.dispatch('articles/fetchArticles').
    then(() => {
            this.isLoading = false;
    })
  }
};
</script>

从“vuex”导入{MapGetter，mapActions}；
导出默认值{
名称：“文章”，
计算：{
},
方法：{
…映射操作（['articles/fetchArticles']），
getArticles（）{
返回此.store.dispatch（'articles/fetchArticles'）；
},
},
创建（）{
此.store.dispatch（'articles/fetchArticles'）。
然后（（）=>{
this.isLoading=false；
})
}
};

还有我的纽扣

      <li class="page-item disabled">
            <button
            v-show="next"
            @click="getArticles"
            class="btn btn-sm btn-primary"
        >Devamı...</button>
        </li>

德瓦姆ı。。。

简单地说，我添加了我的下一篇文章，我回答了我关于请求的问题，我现在使用vuex，但VueJs也类似：

fetchArticles (context) {
    context.commit("fetchStart");
    let endpoint = "articles/"

    if (context.state.next) {
      endpoint = context.state.next;
    }

    return ApiService.get(endpoint)
        .then(data=>{
          console.log(data);

          context.commit("setArticles", data.data.results)
          if (data.data.next) {
            context.commit("setNext", data.data.next);
          } else {
            context.commit("setNext", null)
          }
        })
        .catch((response) => {
        console.log(response);
        context.commit("setError", response.data.errors)
      })
  },

从我的vuetemplate中，我将其称为，例如：

<script>
import { mapGetters, mapActions} from "vuex";
export default {
    name: "Articles",
    computed: {
  },
  methods: {
    ...mapActions(['articles/fetchArticles']),
    getArticles() {
        return this.$store.dispatch('articles/fetchArticles');
    },
  },
  created() {
    this.$store.dispatch('articles/fetchArticles').
    then(() => {
            this.isLoading = false;
    })
  }
};
</script>

从“vuex”导入{MapGetter，mapActions}；
导出默认值{
名称：“文章”，
计算：{
},
方法：{
…映射操作（['articles/fetchArticles']），
getArticles（）{
返回此.store.dispatch（'articles/fetchArticles'）；
},
},
创建（）{
此.store.dispatch（'articles/fetchArticles'）。
然后（（）=>{
this.isLoading=false；
})
}
};

还有我的纽扣

      <li class="page-item disabled">
            <button
            v-show="next"
            @click="getArticles"
            class="btn btn-sm btn-primary"
        >Devamı...</button>
        </li>

德瓦姆ı。。。

你找到这个问题的解决方案了吗？请分享你是如何解决这个问题的。是的，我找到了解决方案。请详细说明你的要求，我不会错过一些部分。谢谢。vueJs中的下一个链接未加载新项目。第一页仅加载了“我的视图”中指示的编号。py page_size，即使单击“下一步”，也会显示相同的项目，意思是没有加载新项目我正在使用我的函数获取文章。你能解释更多吗？你找到这个问题的解决方案了吗？请分享你是如何解决这个问题的。是的，我找到了解决方案。请详细说明你的要求，我不会错过一些部分。谢谢。我在vueJs中的下一个链接没有加载新项目。第一页只加载了我的视图中指示的数字。py page_size，即使单击“下一步”，也会显示相同的项目，这意味着没有加载新项目。我正在使用我的函数获取文章。您能解释更多信息吗