რიდაირექთი სხვა მარშრუტზე React Router-ში
ახლა ფორმაში შეყვანილი მონაცემები, პროდუქტის რედაქტირების დროს, ინახება, მაგრამ არის ერთი მაგრამ - მონაცემების შენახვის შემდეგ ჩვენ ვრჩებით ფორმის გვერდზე, მაშინ როცა უნდა დავუბრუნდეთ უკან პროდუქტის გვერდს. ამაში დაგვეხმარება რიდაირექთი, რომელსაც ამ გაკვეთილზე გავეცნობით.
მოდით გავხსნათ ფაილი edit.jsx
და იმპორტი გავაკეთოთ redirect-ის
ბიბლიოთეკიდან:
import { redirect } from 'react-router-dom';
შემდეგ კი გავაკეთოთ ისე, რომ ფუნქცია
action აბრუნებდეს არა 1-ს,
არამედ გადაგვისამართებდეს საჭირო
მარშრუტზე. ამ შემთხვევაში ჩვენ უნდა
დავუბრუნდეთ უკან პროდუქტის გვერდზე:
return redirect(`/products/${params.productId}`);
ახლა, შენახვის ღილაკზე დაჭერით, ჩვენ ვბრუნდებით უკან პროდუქტის გვერდზე განახლებული მონაცემებით.
იგივე შეგვიძლია გავაკეთოთ ახალი პროდუქტის დამატებისთვისაც, ბოლოსდაბოლოს უფრო მოსახერხებელი იქნებოდა დაუყოვნებლივ გამოგვეჩინა ფორმა და შ�ვევსო ის. მოდით ასევე გავაკეთოთ.
დასაწყისისთვის ახლა უნდა გავხსნათ
ფაილი root.jsx და იმპორტი გავაკეთოთ
redirect-ის, რადგან პროდუქტების
დამატება ხდება მთავარ გვერდზე:
import { redirect } from 'react-router-dom';
ისევ ვიღებთ ფუნქციას action და
ახლა დავაბრუნებთ არა product-ს,
არამედ გავაკეთებთ რიდაირექთს რედაქტირების
გვერდზე:
return redirect(`/products/${product.id}/edit`);
შევამოწმოთ ესეც. ახლა დავაჭერთ პროდუქტის დამატების ღილაკს და ვნახავთ მისი რედაქტირების ფორმას
აიღეთ აპლიკაცია, რომელიც თქვენ შექმენით წინა გაკვეთილების დავალებებში. გაკვეთილის მასალების გამოყენებით, რეალიზაცია გაუკეთეთ მასში რიდაირექთს სტუდენტის გვერდზე მონაცემების შენახვის ღილაკზე დაჭერის შემდეგ ფორმის გვერდზე.
ახლა კი რეალიზაცია გაუკეთეთ რიდაირექთს მთავარი გვერდიდან სტუდენტის მონაცემების რედაქტირების ფორმის გვერდზე სიაში სტუდენტის დამატების ღილაკზე დაწკაპუნების შემდეგ.
