为什么我点击的用户没有被删除？

Question

我无法删除我在页面上选择的那个。每次列表中的第一个时它都会删除。

我不知道它是否与后端有关。如果是这种情况，您必须告诉我，然后我会在后端将其带入。

我的 UserManagement.js：

function UserManagement({ history }) {
 
  const dispatch = useDispatch();
  
  const userLogin = useSelector((state) => state.userLogin);
  const userList = useSelector((state) => state.userList);
  const { loading  } = userLogin;
  const { users} = userList;

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

  const deleteHandler = (id) => {
    if (window.confirm("Are you sure? you want to delete")) {
      dispatch(deleteUserAction(id));
    }
  };

  
  console.log(userList);
  console.log(users);
  return (
    <MainScreen title={`List of Users`}>
       <Link to="/createUser" id="OpenCreateUserDialogButton">
        <Button style={{ marginLeft: 10, marginBottom: 6 }} size="lg">
          Create new User
        </Button>
      </Link>
      
      {loading && <Loading />}
     
      {users &&
        users?.map((users) => (
         
          <Accordion>
            <Card style={{ margin: 10 }} key={users._id}>
              <Card.Header style={{ display: "flex" }}>
                <span
                  // onClick={() => ModelShow(note)}
                  style={{
                    color: "black",
                    textDecoration: "none",
                    flex: 1,
                    cursor: "pointer",
                    alignSelf: "center",
                    fontSize: 18,
                  }}
                >
                      
                      {users.userID}               
                </span>
                <div>
                  <Link to="/profileedit">
                    <Button
                    id="EditButton"
                    >Edit</Button>
                    </Link>
                    <Button
                      id="DeleteButton"
                      variant="danger"
                      className="mx-2"
                      onClick={() => deleteHandler(users.id)}
                    >
                      Delete
                    </Button>
                  </div>
              </Card.Header>

这是我的用户操作：

  export const deleteUserAction = (_id) => async (dispatch, getState) => {
    try {
      dispatch({
        type: USER_DELETE_REQUEST,
      });
  
      const {
        userLogin: { userInfo },
      } = getState();
  
      const url = "http://localhost:8080/user/";
  
      const config = {
        headers: {
          Authorization: `Bearer ${userInfo.token.token}`,
        },
      };
      console.log(userInfo.token.token);
      const { data } = await axios.delete(url, config);
  
      dispatch({
        type: USER_DELETE_SUCCESS,
        payload: data,
      });
    } catch (error) {
      const message =
        error.response && error.response.data.message
          ? error.response.data.message
          : error.message;
      dispatch({
        type: USER_DELETE_FAIL,
        payload: message,
      });
    }
  };

后端（服务器）：

exports.deleteUser = async (request, response) => {
  try{
      await User.deleteOne({id: request.params.id});
      response.status(201).json("User deleted Successfully");
  } catch (error){
      response.status(409).json({ message: error.message});     
  }
}

Answer 1

您只是发送一个axios.delete() 呼叫请求。但是您没有将要实际删除的确切用户的任何标识符传递给该 API 请求。

您需要将标识符作为参数与您在axios.delete() 中传递的URL 一起传递。

例子：

      const url = "http://localhost:8080/user/$_id";

      ...

      const { data } = await axios.delete(url, config);
  
      ...