diff --git a/frontend/src/pages/DishList.tsx b/frontend/src/pages/DishList.tsx
index 5eef344..d882add 100644
--- a/frontend/src/pages/DishList.tsx
+++ b/frontend/src/pages/DishList.tsx
@@ -33,6 +33,7 @@ import {
 import { ToBuy, Stuff } from '../types/types';
 import { GENERAL_ERRORS } from '../constants/errorMessages';
 import CategoryDropDown from "../components/CategoryDropDown";
+import { Console } from 'console';
 
 const DishList: React.FC = () => {
     const navigate = useNavigate();
@@ -83,6 +84,8 @@ const DishList: React.FC = () => {
     const [allDish, setAllDish] = useState<Dish[]>();
     // 食材リスト
     const [stuff, setStuff] = useState<Stuff[]>([]);
+    // 画面表示用の食材情報配列
+    const [tempStuff, setTempStuff] = useState<Stuff[]>([]);
     // 料理名
     const [selectedDishName, setSelectedDishName] = useState('');
     // 料理情報
@@ -90,8 +93,6 @@ const DishList: React.FC = () => {
         recipeName: '',
         summary: '',
         stuffs: []});
-    // 画面表示用の食材情報配列
-    const [testDishArray, setTestDishArray] = useState<Dish[]>(testdish);
     // エラーメッセージの状態管理
     const [error, setError] = useState(false);
     // 選択した料理の情報を表示するダイアログの表示状態
@@ -115,7 +116,7 @@ const DishList: React.FC = () => {
     const changeDialog = () => {
         setOpenDialog(false);
         setOpenChangeDialog(true);
-        setTestDishArray(testdish);
+        setTempStuff(stuff);
     };
 
     const cancelChange = () => {
@@ -156,9 +157,12 @@ const DishList: React.FC = () => {
      */
     const handleDeleteStuffTemp = async (stuff_id: number) => {
         try {
-              let stuffCopy = [...stuff]; // 配列をコピー
-              stuffCopy.splice(stuff_id, 1);
-              setStuff(stuff);
+              let tempStuffCopy = [...tempStuff]; // 配列をコピー
+              console.log(stuff_id);
+              console.log(tempStuffCopy);
+              tempStuffCopy = tempStuff.filter(stuff => stuff.stuffId !== stuff_id);
+              console.log(tempStuffCopy);
+              setTempStuff(tempStuffCopy);
               // fetchTasks(); // 削除後のタスク一覧を再取得
             } catch (error) {
               // console.error(`${TASK_ERRORS.DELETE_FAILED}:`, error);
@@ -306,7 +310,7 @@ const DishList: React.FC = () => {
                 <FormGroup>
                     {/* <List> */}
                         {/* タスク一覧をマップして各タスクをリストアイテムとして表示 */}
-                        {stuff.map((stuff, stuffId) => (
+                        {tempStuff.map((tempStuff, stuffId) => (
                             <ListItem
                                 key={stuffId}
                                 sx={{
@@ -323,14 +327,14 @@ const DishList: React.FC = () => {
                                 /> */}
                                 {/* タスクのタイトルと説明 - 完了状態に応じて取り消し線を表示 */}
                                 <ListItemText
-                                    primary={stuff.stuffName}
+                                    primary={tempStuff.stuffName}
                                     // secondary={task.description}
                                     sx={{width: '80%'}}
                                 />
                                 {/* 食材の個数を表示 */}
                                 <ListItemText
                                     primary={<Typography style={{textAlign:"center"}}>個数<br />
-                                    {stuff.amount}
+                                    {tempStuff.amount}
                                     </Typography>
                                     }
                                     // secondary={task.description}
@@ -342,7 +346,7 @@ const DishList: React.FC = () => {
                                     <IconButton
                                         edge="end"
                                         aria-label="個数を編集"
-                                        onClick={() => changeSelectedItemAmount(stuff, stuff.stuffName, stuff.amount)}
+                                        onClick={() => changeSelectedItemAmount(tempStuff, tempStuff.stuffName, tempStuff.amount)}
                                     >
                                         <ShoppingBasketIcon />
                                     </IconButton>
@@ -365,7 +369,7 @@ const DishList: React.FC = () => {
                                     <IconButton
                                         edge="end"
                                         aria-label="delete"
-                                        onClick={() => handleDeleteStuffTemp(stuffId)}
+                                        onClick={() => handleDeleteStuffTemp(tempStuff.stuffId)}
                                     >
                                         <DeleteIcon />
                                     </IconButton>