//獲取該頁的數(shù)據(jù) 
	let minNum = (val.page - 1)*val.limit 
   	let maxNum =val.page*val.limit 
   	this.imgList = dataList.slice(minNum,maxNum)

//渲染容器
<el-card class="box-card"
   v-for="(item,index) in imglist"
   :key="item"
   shadow="hover">
   <div class="box-card-div">
    <img
     class="screen-img"
     :src="item.img"
     :key="index"
     :alt="item.name"
    />
   	<div class="title">{{ item.name }}</div>
  </div>
</el-card>

//分頁
<pagination
  v-show="toggPage.total > 0"
  :total="toggPage.total"
  :page.sync="toggPage.currentPage"
  :limit.sycn="toggPage.size"
  @pagination="togghandleCurrentChange"
 />

//因為業(yè)務(wù)需求封裝的方法
queryImgList(){
	//給頁面家了一個loading
	this.imgloading = true
     //獲取分頁總條數(shù)
     this.toggPage.total = this.dataList.length
     //頁面初始化時顯示的前十條數(shù)據(jù)
     this.imgList = dataList.slice(0,10)
     this.imgloading = false
},

togghandleCurrentChange(val){
	//如果不知道val可以在這打印
	console.log('val',val)
	this.imgloading = true
	this.toggPage.size = val.limit
	this.toggPage.currentPage = val.page
	//記得將數(shù)據(jù)先制空在進(jìn)行賦值,否則你懂的
	this.imgList = []
	//獲取當(dāng)前頁面的數(shù)據(jù)
	let minNum = (val.page - 1)*val.limit
    let maxNum = val.page*val.limit
    this.imgList = this.dataList.slice(minNum,maxNum)
    this.imgloading = false
}

queryBtn(){
	//之所以判斷是否為空 -----如果用戶沒有輸入直接點(diǎn)擊就沒必要再去執(zhí)行下面代碼
	if(this.queryImgValue){
		let img = []
		//循環(huán)該數(shù)據(jù)進(jìn)行匹配
       	this.dataList.forEach(item => {
       	//如果name包含用戶輸入的名稱將該條數(shù)據(jù)push到新數(shù)組中
          if(item.name.includes(this.queryImgValue)){
            img.push(item)
          }
        })
        //賦值給imgList,不要忘記還需要給查詢的總條數(shù)賦值喲
        this.imglist = img
        this.toggPage.total = this.imglist.length
	}
}