vue简单分页

    const app = {
        data() {
            return {
                info: [], // 存储题目详情数组
                currentPage: 1, // 当前页码
                pageSize: 3, // 每页显示的题目数量
                sjid: sjid
            };
        },
        methods: {
            fetchData(page = 1) {
                axios
                    .get('/api/shijuan/timu_list.html', {
                        params:{
                            p: page,
                            limit: this.pageSize,
                            sjid: this.sjid
                        }
                    })
                    .then(response => {
                        this.info = response.data.data;
                        this.p = response.data.p;
                    })
                    .catch(error => {
                        console.error('Error fetching data:', error);
                    });
            },
            handlePageChange(page) {
                if (page >= 1) {
                    this.currentPage = page;
                    this.fetchData(page);
                }
            }
        },
        mounted() {
            this.fetchData(this.currentPage);
        }
    };
    Vue.createApp(app).mount('#app');

        <div>
            <button @click="handlePageChange(currentPage - 1)" :disabled="currentPage <= 1">上一页</button>
            <span>当前页: {{ currentPage }}</span>
            <button @click="handlePageChange(currentPage + 1)">下一页</button>
        </div>