vue+iview分頁,調用后台接口


<div>
    <Result1 :columns="columns1" :PageData="PageData"></Result1>
    <Page :total="dataCount" prev-text="上一頁" next-text="下一頁" @on-change="changePage"></Page>
</div>

<script>
    export default{
        data(){
            return{
                PageData:[],
                dataCount:0,
                columns1:[]
            }
        },
        methods:{
            getPageData(){
                const idplayLength = 6;  //每頁條數
                const idplayStart = idplayLength * this.page - 1;   //每頁開始的第一條
                const iCols = 0;   //排序字段的個數默認為0
                const sEcho = 0;
                if (this.newText) {
                    this.cont=this.newText;
                }else {
                    this.cont=this.inputValue;
                }
                //接口名(){方法}
                findPageList(idplayLength,idplayStart,iCols,sEcho,this.cont).then(res => {
                    // console.log(res,'res');
                    this.dataCount = res.iTotal;
                    this.PageData = res.data;
                    this.page++
                }).catch(err => {})
            },
            changePage(page){
                this.page=page - 1;
                this.getPageData(page)
            }
        }
    }
</script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM