Como apagar registro do banco de dados com Laravel 11 e React
Neste tutorial, será apresentado como apagar um registro do banco de dados com Laravel 11 e React.
Primeiramente, será demonstrado como exibir o alerta para confirmar a exclusão.
Em seguida, será explicado como apagar o usuário no banco de dados com Laravel.
Por fim, será mostrado como exibir o alerta após a exclusão do registro no banco de dados.
Download do código fonte desenvolvido na aula: Download
PlayList sobre Laravel 11 + Breeze + React 11: Acessar
Receber as aulas gratuitas do curso de Laravel: Acessar
Para começar, é utilizado como base o projeto da aula "Como criar formulário editar com Laravel 11 e React".
Criada a rota no arquivo "routes/web.php".
Route::delete('/destroy-user/{user}', [UserController::class, 'destroy'])->name('users.destroy');
Criado o método "destroy" na controller "app/Http/Controllers/UserController.php".
O método é responsável por apagar o registro no banco de dados e redirecionar para a rota de listagem..
public function destroy(User $user)
{
// Excluir o registro do banco de dados
$user->delete();
return Redirect::route('users.index')->with('success', 'Usuário apagado com sucesso!');
}
Criado o componente para o usuário confirmar a exclusão em "resources/js/Components/Delete/ConfirmDeleteButton.js".
import { useForm } from "@inertiajs/react";
import React from "react";
import DangerButton from "../Button/DangerButton";
function ConfirmDeleteButton({ id, routeName }) {
const { delete: destroy } = useForm();
const handleDelete = () => {
if(window.confirm("Tem certeza que deseja deletar este registro!")){
destroy(route(routeName, id));
}
}
return (
<DangerButton className="ms-1 text-sm" onClick={handleDelete}>
Apagar
</DangerButton>
);
}
export default ConfirmDeleteButton;
O componente criado acima é utilizado na página que contém a funcionalidade de listagem de registros: "resources/js/Pages/Users/UserIndex.js".
<ConfirmDeleteButton id={user.id} routeName="users.destroy" />
Baixar o código-fonte completo do projeto.
Bom, era isso. Espero que o tutorial tenha sido útil!