動態分頁/計算屬性不更新

Question

我有一個動態分頁程序，不基於底層計算屬性（這是更新，我已從控制檯驗證）更新。

<template v-for="(p, i) in pageStart + 4"> 
     <li v-if="p <= lastPage && i <= 4" @click="getPage(p)" :class="{active: isActive(p)}"><a href="#">{{ p }}</a></li> 
    </template> 

在上面的例子中，pageStart是改變正確的，因爲我點擊不同分頁程序數字的計算性能 - 但本身並沒有改變號碼。換句話說，這個v-for循環中的'p'永遠不會更新，所以我總是被一個編號爲1-5的paginator卡住。

Answer 1

您的for循環邏輯有問題。對於pageStart的每個值，v-for將從1到pageStart + 4循環。與此同時，您有i <= 4，因此每次更改pageStart時只會呈現前4個。

你可能想要更多的東西一樣：

<template v-for="p in 4"> 
    <li v-if="p + pageStart <= lastPage" 
     @click="getPage(p + pageStart)" 
     :class="{active: isActive(p + pageStart)}"> 
     <a href="#">{{ p + pageStart }}</a> 
    </li> 
</template>