كيف أحذف المستخدمين فى هذا الكود ؟ MERN

Ahmed Sawy · 12 مايو 2021

هذه مصفوفة جلبتها من مونجو (قاعدة البيانات) واريد ان اقوم بحذف احد المستخدمين بواطسة الفرونت اند .. ال API يعمل بشكل صحيح عند الحذف باستخدام بوست مان ولكنى اريد ان احذف فى الباك اند ..

هذا هو الكود

import React, { useContext, useState, useEffect } from "react";
import { View, Text, FlatList } from "react-native";
import axios from "axios";

import UserCard from "../components/UserCard";
import baseURL from "../assets/common/baseUrl";

function UserListScreen({ navigation }) {
  const [users, setUsers] = useState([]);

  const getUsers = () => {
    axios
      .get(`${baseURL}users`)
      .then((res) => setUsers(res.data))
      .then(() => console.log(users))
      .catch((err) => console.log(err));
  };

  
  // اعتقد ان الخطأ هنا 
  const deleteUser = (id) => {
    axios
      .delete(`${baseURL}users/${id}`)
      .then((res) => {
        const users = users.filter((item) => item.id !== id);
        setUsers(users);
      })
      .catch((error) => console.log(error));
  };

  useEffect(() => {
    getUsers();
  }, []);

  return (
    <View style={{ padding: 20, flex: 1 }}>
      <Text>Liset Of Users</Text>
      <FlatList
        style={{ height: "50%" }}
        data={users}
        keyExtractor={(item) => item._id}
        renderItem={({ item }) => (
          <UserCard
            //  هذه مجرد بروبس انا اضفتها  
            name={item.name}
            email={item.email}
            isAdmin={item.isAdmin === true ? "He Is Admin" : "Not an Admin"}
            onDelete={deleteUser}
          />
        )}
      />
    </View>
  );
}

export default UserListScreen;

Wael Aljamal · 12 مايو 2021

أعتقد أنك أشرت لمكان الخطأ، لاحظ أن الرابط مكتوب بطريقة خطأ ينقصعه كتابة / قبل users :

.delete(`${baseURL}/users/${id}`)
                  ^^^

وسوف يعمل بالشكل المطلوب.

Ahmed Sawy · 12 مايو 2021

بتاريخ منذ ساعة مضت قال Wael Aljamal:
أعتقد أنك أشرت لمكان الخطأ، لاحظ أن الرابط مكتوب بطريقة خطأ ينقصعه كتابة / قبل users :
.delete(`${baseURL}/users/${id}`)
                  ^^^
وسوف يعمل بالشكل المطلوب.

لا .. هذه ال / قد قمت بتخزينها فى ال baseURL .. الخطأ ليس هنا

Wael Aljamal · 12 مايو 2021

بتاريخ 19 ساعات قال Ahmed Sawy:

لا .. هذه ال / قد قمت بتخزينها فى ال baseURL .. الخطأ ليس هنا

حسنا، للتأكد أن id يتم تمريره بشكل صحيح نحاول طباعته في جسم التابع:

const deleteUser = (id) => {

	console.log(id); // تأكد

    axios
      .delete(`${baseURL}users/${id}`)
      .then((res) => {
        const users = users.filter((item) => item.id !== id);
        setUsers(users);
      })
      .catch((error) => console.log(error));
  };

لاحظ أن الاستدعاء لايقوم بتمرير id

يفضل وضع اسم متغير مختلف في الجزء:

const newUsers = users.filter((item) => item.id !== id);

setUsers(newUsers);

Salah Eddin Beriani2 · 13 مايو 2021

تأكد من أن في component userCard انت تعطي الدالة deleteUser المعامل id

 const deleteUser = (id) => {
   console.log(id)
    axios
      .delete(`${baseURL}users/${id}`)
      .then((res) => {
        const users = users.filter((item) => item.id !== id);
        setUsers(users);
      })
      .catch((error) => console.log(error));
  };

اذا كان ال id يصل للدالة فالخطوة التالية هي التأكد من أن baseURL ليس NULL او UNDEFINED

 const deleteUser = (id) => {
console.log(baseURL)
    axios
      .delete(`${baseURL}users/${id}`)
      .then((res) => {
        const users = users.filter((item) => item.id !== id);
        setUsers(users);
      })
      .catch((error) => console.log(error));
  };

اذا كان ال baseUrl صحيح تأكد من أنك تستخدم ال method delete وليس post في api

كيف أحذف المستخدمين فى هذا الكود ؟ MERN

السؤال

Ahmed Sawy

4 أجوبة على هذا السؤال

Recommended Posts

Wael Aljamal

Ahmed Sawy

Wael Aljamal

Salah Eddin Beriani2

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية