[ { "id": 1, "name": "Frank Li", "sex": "male", "age": "30", "courses": [ "HTML", "CSS", "Javascript", "Java", "PHP", "MySQL", "Ubuntu", "MongoDB", "NodeJS", "AngularJS", "Photoshop", "LESS", "Bootstrap" ] }, { "id": 2, "name": "Cherry", "sex": "female", "age": "27", "courses": [ "Anderson's Fairy Tales", "Pride and Prejudice", "Vanity Fair", "Oliver Twist" ] }, { "id": 3, "name": "John Liu", "sex": "male", "age": "29", "courses": [ "iology and medical science", "pplied biology", "medicine", "cell biology" ] }, { "id": 4, "name": "Lucy Mu", "sex": "female", "age": "22", "courses": [ "Introduction to ART ", "sketch", "Composition", "sculpture" ] } ]
这是刚开始的样子，地址栏中默认的path是/1，所以直接显示了第一个学生的信息。页码总数也能获得。
点击了Previous按钮后的效果。不能再往前翻页了
处于第4页时，点击Next按钮时的效果。不能再往后翻页了。
在页码范围内翻页是没有问题的！
鉴于篇幅，我就不演示输入的页码超出范围的情况了。上面的截图是输入正确范围的页码，点击Go按钮的效果。