-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Feat/anan/pagination #25
base: dev
Are you sure you want to change the base?
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
https://www.youtube.com/watch?v=a1wW0AjQCI8
ฟังเพลงนี้ไประหว่างแก้ pr
import Dropdown from '../Dropdown/Dropdown.svelte'; | ||
|
||
export let Arrayitem: string[] = []; // Explicitly define the type as any[] | ||
let currentPage: number | string = 1; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ขอ 2 อันนี้เป็น type number
หน่อย
let currentPage: number
let itemsPerPage: number
เดี่ยว backend จะส่งมาเป็น type number เหมือนกัน
และมันจะไม่ต้องไป ParseInt
หลายๆที่
หลังจากเปลี่ยน type แล้วพยายามเอา ParseInt
ออกไป
<button | ||
class={cn( | ||
' px-4 max-md:px-4 py-2 rounded max-md:scale-75', | ||
currentPage === page ? 'text-white bg-sucu-pink-02 ' : 'text-black bg-white border' | ||
)} | ||
on:click={() => changePage(page)} | ||
> | ||
{page} | ||
</button> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
เอาอีก if นึงมาครอบตรงนี้มันจะได้ไม่ type error หลังจากนั้น
{#if typeof page === 'number'}
<button>some content</button>
{/if}
function changePage(page: number | string) { | ||
currentPage = page; | ||
paginateItems(); | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
เวลา change page ขอแบบให้มีขอบเขตหน่อย
function changePage(page: number) {
if (page < 1) {
currentPage = 1;
} else if (page > totalPages) {
currentPage = totalPages;
} else {
currentPage = page;
}
}
import { faChevronLeft, faChevronRight } from '@fortawesome/free-solid-svg-icons'; | ||
import Dropdown from '../Dropdown/Dropdown.svelte'; | ||
|
||
export let Arrayitem: string[] = []; // Explicitly define the type as any[] |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ลบ comment นี้ออกไปมันคือ string[]
ไม่ใช่ any[]
let currentPage: number | string = 1; | ||
let itemsPerPage: string = '5'; // Default items per page | ||
let totalPages: number = Math.ceil(Arrayitem.length / parseInt(itemsPerPage)); | ||
let paginatedItems: string[] = []; | ||
|
||
const pageChoice: string[] = ['5', '10', '15']; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
พวกนี้อาจจะต้องเปลี่ยนเป็น props แทนหมายถึงต้อง export ไว้ด้วยละกันเพื่อ custom ทีหลัง
Type of Change
Description
pagination component+ responsive
Screenshots or GIFs (if applicable)