如何为不同的当前页面调用不同的方法？

Question

 perPage: 3, currentPage: 1, computed: { rows() { return this.productsList.length }, methods: { page() { if (this.currentPage = 2) { let accToken = localStorage && localStorage.loggedinUser? localStorage.loggedinUser: null; const categoryUrl = project_key + '/product-projections/search?offset=12&limit=12'; const sendGetRequest = async() => { let access_token = await axios.request({ method: "get", baseURL: categoryUrl, headers: { 'Authorization': "Bearer " + accToken, 'Content-Type': 'application/json', }, data: {} }).then((response) => { if (response) { // this.productsList = response.body; this.productsList = response.data.results; // eslint-disable-next-line console.log(this.productsList); } }); }; sendGetRequest(); } },

 <b-pagination v-model="currentPage":total-rows="rows":per-page="perPage" aria-controls="my-table" @change="page"></b-pagination> <p class="mt-3">Current Page: {{ currentPage }}</p>

I am using b-pagination event per-page="perPage", And i am writing method to call api.

Where in perPage() i am calling if (this.currentPage = 2) {}. So my question is by using single:per-page="perPage", can i write multiple methods and change currentPage for each method?

Answer 1

<b-pagination 
    v-model="currentPage" 
    :total-rows="rows" 
    :per-page="perPage" 
    aria-controls="my-table" 
    @change="page"
></b-pagination>

If you look into the code. There is @change event is listening. You need to add page() function in your methods. like below

methods: {
    page(event) {
        this.currentPage = event
        let offset = (this.currentPage * this.perPage)
        const categoryUrl = project_key + `/product-projections/search?offset=${offset}&limit=${this.perPage}`;
        // other logics....
    }
}