Özet - Redux Toolkit

Bir sepet slice'ı ve store kurup bileşene bağlarsın.

Özet - Redux Toolkit

Bu grupta RTK'nin ne olduğunu, createSlice ile slice yazmayı ve configureStore ile store kurmayı öğrendin. Şimdi bunları birleştirme zamanı.

Tipik akış: createSlice ile bir sepet slice'ı yazarsın; configureStore ile store'a bağlarsın; Provider ile uygulamayı sararsın; bileşenler useSelector ve useDispatch ile sepeti okur ve değiştirir.

Bir sonraki adımda tam bir sepet akışı yazacaksın.

Uygulama Sepet bileşeni yaz

Aşağıdaki iskeleti tamamla. Cart bileşeni yaz. useSelector ile state.cart.items'ı oku (state parametresi). useDispatch ile dispatch al. <ul> içinde items.map((item, i) => <li key={i}>{item.name}</li>) döndür. export default ekle.

Örnek çözümü göster

import { useSelector, useDispatch } from 'react-redux';
import { addItem } from './cartSlice';

function Cart() {
  const items = useSelector((state) => state.cart.items);
  const dispatch = useDispatch();
  return (
    <ul>
      {items.map((item, i) => (
        <li key={i}>{item.name}</li>
      ))}
    </ul>
  );
}

export default Cart;

Kendini test et

Bu grupta işlenmeyen konu?
```
Three topics were covered; RSC was not.
```
- createSlice
- configureStore
- Provider
- Server Components
Cevabı göster

Server Components — Server Components bu grupta işlenmedi.

useDispatch çağrısı

const ____ = useDispatch();

Cevabı göster

const dispatch = useDispatch();

Sıradaki ders: Zustand nedir?

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler