为中华之崛起而读书
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue.min.js"></script> <script src="js/axios.min.js"></script> </head> <body> <div id="t"> <table> <tr> <td>id</td> <td>name</td> <td>操作</td> </tr> <tr v-for="k in list"> <td>{{k.uid}}</td> <td>{{k.uname}}</td> <td>{{k.status}}</td> <td> <input type="button" @click="a()" v-if="k.status==0" value="保存"/> <input type="button" v-on:click="b()" v-if="k.status==1" value="舍弃"/> </td> </tr> </table> <span v-if="this.current>1"> <input type="button" v-on:click="fnone()" v-if="true" value="首页"/> </span> <span v-if="this.current-1>=1"> <input type="button" v-on:click="fnprev()" v-if="true" value="上一页"/> </span> <span v-if="this.current+1<=total"> <input type="button" v-on:click="fnnext()" v-if="true" value="下一页"/> </span> <span v-if="this.current!=total"> <input type="button" v-on:click="fnlast()" v-if="true" value="尾页"/> </span> </div> </body> <script> var nv=new Vue({ el:"#t", data:{ list:[], current:1, total:1 }, methods:{ fnnext:function(){ if(this.current+1<=this.total){ this.current=this.current+1; this.fnboss(); } }, fnprev:function(){ if(this.current-1>=1){ this.current=this.current-1; this.fnboss(); } }, fnone:function(){ this.current=1; this.fnboss(); }, fnlast:function(){ this.current=this.total; this.fnboss(); }, fnboss:function(){ axios.get(`http://localhost:8080/list/${this.current}`).then(obj=>{ console.log(obj); this.list=obj.data.data.content; this.total=obj.data.data.totalPages; }) } }, created:function(){ this.fnboss(); } }) </script> </html>