Uview Gird Swiper翻页数据渲染

第一次用这个 踩坑。
宫格数据14条，分两页展示数据第一页展示12条，第二页展示2条。
实现过程
1:数据源+页面加载时获取长度

data() {
			return {
				gridList: [
					{
						title: '1',
						img: '/static/ui/notice.png',
						url: 'gonggao',
					},
					{
						title: '2',
						img: '/static/ui/score.png',
						url: 'score',
					},
					{
						title: '3',
						img: '/static/ui/test.png',
						url: 'test',
					},
					{
						title: '4',
						img: '/static/ui/subject.png',
						url: 'class',
					},
					{
						title: '5',
						img: '/static/ui/plan.png',
						url: 'plan',
					},
					{
						title: '6',
						img: '/static/ui/student.png',
						url: 'userinfo',
					},
					{
						title: '7',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
					{
						title: '8',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
					{
						title: '9',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
					{
						title: '10',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
					{
						title: '11',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
					{
						title: '12',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
					{
						title: '13',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
					{
						title: '14',
						img: '/static/ui/class.png',
						url: 'jiaoshi',
					},
				],
				swiperindex: []
			}
		},
			onLoad() {
			if(this.gridList.length > 12){
				for (let i =0 ; i <= Math.floor(this.gridList.length/12); i++){
					this.swiperindex[i] = i;
				}
			}else{
				this.swiperindex[0] = 0;
			}
		},

2：渲染

	<swiper :indicator-dots="true" class="swiper">
					<swiper-item v-for="(sindex) in swiperindex">
						<u-grid :border="true" >
							<u-grid-item :customStyle="{width:220+'rpx',height:220+'rpx'}" v-if="index >= sindex*12 && index < (sindex+1)*12" v-for="(item, index) in gridList" :index="index + sindex*12">
								<image :src="item.img" class="image" mode="aspectFill" />
								<text class="grid-text">{{item.title}}</text>
							</u-grid-item>
						</u-grid>
					</swiper-item>
				</swiper>

实现效果：