This page will communicate with the server-side DELETE route, /api/user/, to delete the existing user:
- Create a <button> element that we can use to delete the document in the <template> block. We don't need a form to send the data because we can collect the data (which is only the document _id data) in the remove method. We only need the button to trigger this method as follows:
// pages/users/delete/_id.vue
<button v-on:click="remove">Delete</button>
- Create the remove method to send the data to the server as we explained in the <script> block. But first, we will need to use the asyncData method to fetch the existing data:
// pages/users/delete/_id.vue
export default {
async asyncData ({ params, error }) {
// Fetch the existing user
// Same as in update page
},
methods: {
async remove () {
let payload = { id: this.id }
let { data } = await axios.delete('/api...