分页

 

<el-pagination
        v-model:currentPage="tableParams.page"
        v-model:page-size="tableParams.pageSize"
        :total="tableParams.total ? tableParams.total : 0"
        :page-sizes="[10, 20, 50, 100]"
        small=""
        background=""
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        layout="total, sizes, prev, pager, next, jumper"
/>

const tableParams = ref({
    page: 1,
    pageSize: 10,
    total: 0 ,

});
// 改变页面容量
const handleSizeChange = (val: number) => {
    tableParams.value.pageSize = val;
    getResearchTrends();//数据请求
};

// 改变页码序号
const handleCurrentChange = (val: number) => {
    tableParams.value.page = val;
    getResearchTrends();//数据请求

};