useSelectorでstoreにアクセスして表示してみよう

s-yoshiii · Sep 1, 2022 · 9d1d789 · 9d1d789
1 parent f3010c1
commit 9d1d789
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/src/components/Navbar.js b/src/components/Navbar.js
@@ -1,14 +1,17 @@
 import React from "react";
+import { useSelector } from "react-redux";
 
 const Navbar = () => {
+  const { amount } = useSelector((store) => store.cart);
+  console.log(amount);
   return (
     <nav>
       <div className="nav-center">
         <h3>Redux Shopping</h3>
         <div className="nav-container">
           ロゴ
           <div className="amount-container">
-            <p className="total-amount">0</p>
+            <p className="total-amount">{amount}</p>
           </div>
         </div>
       </div>

diff --git a/src/features/cart/CartSlice.js b/src/features/cart/CartSlice.js
@@ -2,7 +2,7 @@ import { createSlice } from "@reduxjs/toolkit/";
 
 const initialState = {
   cartItems: [],
-  amout: 0,
+  amount: 4,
   total: 0,
 };
 const cartSlice = createSlice({