یلدا ادامه داره... ❤️ ۴۰ درصد تخفیف همه دوره‌ها

استفاده از تخفیف‌ها
ثانیه
دقیقه
ساعت
روز
x
2 سال پیش توسط x مطرح شد
3 پاسخ

افزودن دکمه صفحه قبل و بعد در ریکت

سلام خسته نباشید......

من میخوام وقتی کاربر به صفحه پستش میره این امکان رو داشته باشه که بین پستاش ورق بزنه که نیازی نباشه هی بک بزنه و صفحه بعدیش رو انتخاب کنه این کد من چطور میتونم این قابلیت رو بهش اضافه کنم

import React, { useContext, useState, useEffect } from "react";
import { useParams } from "react-router-dom";
import { GlobalState } from "../../../GlobalState";

function post() {
  const params = useParams();
  const state = useContext(GlobalState);
  const [posts] = state.userAPI.post;
  const [post, setPost] = useState([]);

  useEffect(() => {
    if (params.id) {
        posts.forEach((post) => {
        if (post._id === params.id) setPost(post);
      });
    }
  }, [ params.id, posts ]);

  return (
    <div className="container-fluid">
      <div className="row">
            <div className="col-md-12 col-sm-12 col-xs-12 box6-inner text-center">
              <h2 className="f7">{post.title}</h2>
              </div>
            </div>
          </div>
  );
}

export default post;

ممنونم از همه دوستان....❤️


ثبت پرسش جدید
x
تخصص : هیچولوژیست
@SZaaaa1111 2 سال پیش مطرح شد
0

من به این صورت قرارش دادم

  const [ page, setPage ] = useState(0);

  const pageData = useMemo(() => {
    return posts.slice(page+1, (page+1)+1)
},[page])

  const nextPage = () => setPage(prev => prev+1)
  const prevPage = () => setPage(prev => prev > 0 ? prev-1 : prev)
{pageData.map(x =>
    <tr>
      <td><Link to={`/post/${x._id}`} >{x.title}</Link></td>
    </tr>
  )}
  <button onClick={nextPage}>Next</button>
  <button onClick={prevPage}>back</button>

ولی مشکلی که داره مثلا من وقتی تو صفحه 10 هستم برام صفحه یک رو نمایش میده و اگه بخوام صفحه یازدهم رو بیاره چه کاری رو باید انجام بدم؟


پویا باقری
تخصص : برنامه نویس وب
@Pouyab 2 سال پیش مطرح شد
1

سلام
از react-paginate استفاده کن.
هفتگی 400 هزار تا دانلود داره


x
تخصص : هیچولوژیست
@SZaaaa1111 2 سال پیش آپدیت شد
0

@Pouyab
ممنون از پاسختون
کد من به درستی داره کار میکنه فقط تنها مشکلی که داره زمانی که وارده صفحه فرضا چهارم میشم برای من صفحه بعدی رو صفحه یک قرار میده
و الان میخوام به این کدی که بالا قرار دادم طوری قرار بدم که اگر وارد هر صفحه ای شد، اگه روی بعدی کلیک کرد براش صفحه 5 رو نمایش بده..........


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام